/* Campaign additions; layout, typography and interactions come from website-hero. */
.marka-timeline { padding: 48px 0; }
.marka-timeline__scroll { overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 12px; }
.marka-timeline__scroll:focus-visible { outline: 2px solid #0e1014; outline-offset: 4px; }
.marka-timeline__chart { --label-width: 310px; position: relative; min-width: 880px; padding: 28px 0 0; }
.marka-timeline__rows { position: relative; list-style: none; margin: 0; padding: 0; }
.marka-timeline__row { display: grid; grid-template-columns: var(--label-width) minmax(0, 1fr); align-items: center; margin-bottom: 14px; min-height: 40px; }
.marka-timeline__label { display: flex; gap: 18px; padding-right: 24px; font-family: "Gilroy-SemiBold", sans-serif; font-size: 1.15rem; line-height: 1.3; }
.marka-timeline__number { font-family: "Gilroy-Regular", sans-serif; }
.marka-timeline__track { position: relative; height: 40px; border-radius: 6px; background: #f5f4f4; }
.marka-timeline__bar { position: absolute; top: 0; bottom: 0; left: var(--start); width: var(--length); border-radius: 6px; background: #252525; }
.marka-timeline__flow { position: absolute; top: 0; bottom: 0; left: var(--start); width: calc(var(--end) - var(--start)); border-radius: 6px; overflow: hidden; background: #dadada; }
.marka-timeline__flow::before { content: ''; position: absolute; inset: 0 0 0 -32px; background: repeating-linear-gradient(120deg, transparent 0 5px, #efefef 5px 8px, transparent 8px 13.8564px); animation: marka-timeline-flow 1.15s linear infinite; }
.marka-timeline__guides { position: absolute; left: var(--label-width); right: 0; top: 0; bottom: 48px; display: flex; justify-content: space-between; pointer-events: none; }
.marka-timeline__guides i { width: 1px; background: #cfcfcf; }
.marka-timeline__guides i:first-child { transform: translateX(16px); }
.marka-timeline__guides i:last-child { transform: translateX(-16px); }
.marka-timeline__axis { display: grid; grid-template-columns: repeat(4, 1fr); margin-left: var(--label-width); padding-top: 36px; font-family: "Gilroy-SemiBold", sans-serif; font-size: 1.1rem; }
.marka-timeline__heading { flex-wrap: wrap; }
.marka-timeline__heading-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px; margin-left: auto; }
.marka-timeline__legend { display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 1rem; }
.marka-timeline__key { flex-shrink: 0; }
@media (max-width: 575px) { .marka-timeline__heading-meta { margin-left: 0; } }
.marka-timeline__legend > span { display: flex; align-items: center; gap: 10px; }
.marka-timeline__key { display: inline-block; width: 36px; height: 16px; border-radius: 5px; }
.marka-timeline__key--work { background: #252525; }
.marka-timeline__key--review { background: repeating-linear-gradient(120deg, #dadada 0 5px, #efefef 5px 8px); }
.marka-timeline__cards { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; margin-top: 40px; }
.marka-timeline__card { background: #f5f4f4; padding: 28px; min-width: 0; }
.marka-timeline__card h3 { display: flex; align-items: baseline; gap: 14px; font-family: "Gilroy-SemiBold", sans-serif; font-size: 1.3rem; line-height: 1.35; margin: 0 0 24px; }
.marka-timeline__card-number { flex-shrink: 0; font-family: "Gilroy-Regular", sans-serif; font-size: .9rem; }
.marka-timeline__checklist { list-style: none; padding: 0; margin: 0; }
.marka-timeline__checklist li { position: relative; padding-left: 30px; font-size: 1.15rem; line-height: 1.6; }
.marka-timeline__checklist li + li { margin-top: 12px; }
.marka-timeline__checklist li::before { content: ''; position: absolute; left: -5px; top: .25em; width: 25px; height: 19px; background: url('../images/bird.svg') no-repeat; transform: scale(.5); }
.marka-package__title { margin: 64px 0 32px; font-size: clamp(2rem, 2.5vw, 3rem); line-height: 1.25; }
.marka-package__cards { margin-top: 0; gap: 24px; }
.marka-package__cards .marka-timeline__card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e6e6e6; border-radius: 12px; padding: 32px; }
.marka-package__meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 36px; color: #818181; font-size: 1rem; line-height: 1.5; }
.marka-package__icon { flex: 0 0 48px; width: 48px; height: 48px; color: #bcc3be; }
.marka-package__cards .marka-timeline__card h3 { display: block; font-size: clamp(1.7rem, 1.8vw, 2.2rem); margin-bottom: 24px; }
.marka-package__description { color: #666; font-size: 1.2rem; line-height: 1.65; margin-bottom: 28px; }
.marka-package__cards .marka-timeline__checklist { border-top: 1px solid #e6e6e6; padding-top: 24px; margin-top: auto; }
.marka-package__cards .marka-timeline__checklist li { padding-left: 24px; }
.marka-package__cards .marka-timeline__checklist li::before { content: '↗'; width: auto; height: auto; left: 0; top: 0; background: none; transform: none; color: #899d80; font-size: 1rem; }
.marka-package__note { margin: 28px 0 0; font-size: 1.15rem; line-height: 1.6; color: #666; }
@media (max-width: 768px) {
    .marka-package__title { margin-top: 40px; }
    .marka-package__cards .marka-timeline__card { padding: 24px; }
    .marka-package__meta { margin-bottom: 28px; }
}
@media (min-width: 640px) { .marka-timeline__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 991px) { .marka-timeline__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@keyframes marka-timeline-flow { to { transform: translateX(16px); } }
@media (min-width: 1200px) { .marka-timeline { padding: 70px 0; } .marka-timeline__chart { --label-width: 360px; } }
@media (prefers-reduced-motion: reduce) { .marka-timeline__flow::before { animation: none; } }
.brand-ai section[id] { scroll-margin-top: calc(var(--website-section-nav-height, 90px) + 24px); }
.brand-ai__comparison, .brand-ai__stat-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.brand-ai__pair-frame { position: relative; overflow: hidden; }
.brand-ai .website-hero__image--bottom { align-self: start; }
@media (min-width: 576px) {
    /* Match the upper square's 25% grid column inside the lower 28% column. */
    .brand-ai .website-hero__image--bottom { width: calc(100% * 25 / 28); justify-self: end; }
}
.brand-ai__pair-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .8s ease; }
.brand-ai__pair-photo.is-active { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .brand-ai__pair-photo { transition: none; } }
.brand-ai__faq { border-bottom: 1px solid #d8d8d8; padding: 28px 0; }
.brand-ai__faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; cursor: pointer; list-style: none; }
.brand-ai__faq summary::-webkit-details-marker { display: none; }
.brand-ai__faq summary::after { content: '+'; font-size: 28px; flex-shrink: 0; }
.brand-ai__faq[open] summary::after { content: '−'; }
.brand-ai__faq h3 { margin: 0; font-size: clamp(1.25rem, 1.5vw, 1.7rem); line-height: 1.35; }
.brand-ai__faq p { margin: 24px 0 0; }
.brand-ai__deliverables { padding-left: 24px; }
.brand-ai__deliverables li { padding: 20px 0 20px 8px; border-bottom: 1px solid #d8d8d8; font-size: 1.2rem; }
/* Offer accordion: typography and checklist spacing from the homepage FAQ. */
.brand-ai .website-process__trigger { font-size: 1.2rem; color: #000; }
.brand-ai .website-process__panel-inner { font-family: "Gilroy-Regular", sans-serif; color: #000; line-height: 1.5; }
.brand-ai .website-process__panel-inner p { padding: 24px 0 0; margin: 0; color: #000; font-size: 1.2rem; line-height: 1.5; }
.brand-ai .website-process__panel-inner > p:last-child { padding-bottom: 24px; }
.brand-ai .website-process__panel-inner ul { padding: 30px 0 0; list-style: none; }
.brand-ai .website-process__panel-inner li { position: relative; display: block; padding: 10px 0 20px 30px; margin: 0 0 15px; border-bottom: 1px solid #cfcfcf; font-size: 1.2rem; line-height: 1.5; }
.brand-ai .website-process__panel-inner li:last-child { border-bottom: 0; }
.brand-ai .website-process__panel-inner li::before { content: ""; position: absolute; left: -5px; top: 15px; width: 25px; height: 19px; background: url('../images/bird.svg') no-repeat; transform: scale(.5); }
@media (min-width: 991px) {
    .brand-ai .website-process__trigger { font-size: 1.6rem; }
    .brand-ai .website-process__panel-inner p,
    .brand-ai .website-process__panel-inner li { font-size: 1.4rem; }
}
.brand-ai a:focus-visible, .brand-ai button:focus-visible, .brand-ai summary:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.brand-ai .website-hero__image { aspect-ratio: 1; object-fit: cover; }
.brand-ai .website-testimonial { margin-top: 40px; }
.marka-showcase__visual { padding: 40px 0 48px; }
.marka-author { padding: 48px 0; }
.marka-author .marka-author__role { font-family: "Gilroy-Medium", sans-serif; color: #666; }
.marka-author__figure { width: 100%; max-width: 600px; margin: 0 auto; }
.marka-author__photo { aspect-ratio: 8 / 5; overflow: hidden; border-radius: 24px; }
.marka-author__photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.marka-author__figure figcaption { margin-top: 16px; font-size: 1rem; line-height: 1.5; color: #666; }
@media (min-width: 768px) { .marka-author { padding: 80px 0; } }
.marka-showcase__heading { margin-bottom: 32px; }
.marka-showcase__image { display: block; width: 100%; height: auto; border-radius: 30px; }
.marka-testimonials .sm-testimonials__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; columns: auto; }
.marka-testimonials .sm-testimonials__item { margin: 0; min-width: 0; }
@media (min-width: 991px) and (max-width: 1279px) {
    .marka-testimonials .sm-testimonials__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
    .marka-testimonials .sm-testimonials__item:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (min-width: 1280px) {
    .marka-testimonials .sm-testimonials__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 30px; }
    .marka-testimonials .sm-testimonials__item { grid-column: span 2; }
    .marka-testimonials .sm-testimonials__item:nth-child(3n + 1):nth-last-child(2),
    .marka-testimonials .sm-testimonials__item:nth-child(3n + 1):nth-last-child(2) + .sm-testimonials__item { grid-column: span 3; }
    .marka-testimonials .sm-testimonials__item:last-child:nth-child(3n + 1) { grid-column: 1 / -1; }
}
.marka-testimonials .sm-testimonials__author { overflow-wrap: anywhere; font-size: 1.15rem; line-height: 1.45; }
.marka-testimonials .sm-testimonials__author p { margin: 0; font-size: 1.15rem; line-height: 1.45; }
.marka-testimonials .sm-testimonials__author strong { font-size: 1.35rem; }
.marka-testimonials .sm-testimonials__text { margin-inline: 0; }
.marka-testimonials .sm-testimonials__text p { font-size: 1.2rem; line-height: 1.65; }
.marka-testimonials .sm-testimonials__text p + p { margin-top: 1rem; }
.marka-showcase__package.website-benefits { padding-top: 0; }
.marka-showcase__title { font-family: "Gilroy-SemiBold", sans-serif; font-size: clamp(1.6rem, 2.5vw, 2.4rem); line-height: 1.3; margin: 0 0 40px; }
.marka-showcase__package .website-benefits__result { margin-top: 70px; }
.marka-showcase__package .website-benefits__result::before { content: '='; height: auto; width: 100%; left: 0; top: -56px; background: none; font-family: "Gilroy-Regular", sans-serif; font-size: 2.5rem; line-height: 1; }
@media (min-width: 768px) {
    .marka-showcase__visual { padding: 60px 0 80px; }
    .marka-showcase__heading { margin-bottom: 40px; }
    .marka-showcase__title { margin-bottom: 64px; }
}

@media (min-width: 768px) {
    .brand-ai__comparison, .brand-ai__stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
    .brand-ai__stat-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Responsive refinements for the campaign; shared components retain their desktop rules. */
.brand-ai .marka-showcase__stats li { gap: 24px; }
.marka-showcase__stat-number { flex: 0 0 110px; font-family: "Gilroy-Regular", sans-serif; font-size: 4rem; line-height: 1; letter-spacing: -.04em; }
.brand-ai .marka-showcase__stats li > span:last-child { min-width: 0; font-size: 1.2rem; line-height: 1.5; }
@media (max-width: 990px) {
    .marka-showcase__stat-number { flex-basis: 88px; font-size: 3.2rem; }
    .brand-ai .marka-showcase__stats li { gap: 16px; }
}
@media (max-width: 768px) {
    .brand-ai .website-hero__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .brand-ai .website-hero__title {
        grid-column: 1 / -1; grid-row: 1; padding: 0 0 28px;
        font-size: clamp(2.2rem, 5.6vw, 3.2rem); line-height: 1.15; text-wrap: balance;
    }
    .brand-ai .website-hero__intro { grid-column: 1 / -1; grid-row: 2; padding: 24px 0 32px; }
    .brand-ai .website-hero__intro::before { width: 100%; }
    .brand-ai .website-hero__intro .sub-title { font-size: 1.4rem; line-height: 1.5; }
    .brand-ai .website-hero__image--top { grid-column: 2; grid-row: 3; }
    .brand-ai .website-hero__image--bottom { grid-column: 1; grid-row: 3; width: 100%; }
    .brand-ai .website-hero__arrow { display: none; }
    .brand-ai .website-process__heading { flex-direction: column; align-items: flex-start; gap: 16px; padding-bottom: 28px; }
    .brand-ai .website-process__heading h2 { font-size: clamp(1.8rem, 4.8vw, 2.4rem); text-wrap: balance; }
    .brand-ai .website-process__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .brand-ai .website-process__visual { position: static; width: 100%; max-width: 360px; margin: 0 auto; }
    .brand-ai .website-process__content { min-width: 0; }
    .brand-ai .website-process__trigger { grid-template-columns: 24px minmax(0, 1fr) 24px; min-height: 44px; }
    .brand-ai .website-benefits__intro { grid-template-columns: minmax(0, 1fr); }
    .brand-ai .website-expert__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .brand-ai .website-expert__profile { padding-right: 0; }
    .brand-ai .website-expert__quote { border-left: 0; border-top: 1px solid #cfcfcf; padding: 28px 0 0; }
    .brand-ai .website-expert__quote p { font-size: 1.8rem; }
    .brand-ai .website-section-nav__links { gap: 24px; }
    .brand-ai .website-section-nav__links a { padding: 16px 0; font-size: 1.1rem; }
    .brand-ai .marka-timeline__heading-meta { margin-left: 0; }
    .brand-ai .marka-timeline__chart { --label-width: 250px; min-width: 760px; }
    .brand-ai .marka-timeline__card { padding: 24px; }
    .brand-ai .button, .brand-ai .btn { max-width: 100%; min-height: 44px; white-space: normal; }
    .brand-ai .sm-faq__trigger { gap: 16px; min-height: 44px; }
    .brand-ai .sm-faq__answer { padding-right: 0; }
    .brand-ai .sm-faq__question { min-width: 0; }
    .brand-ai .sm-faq a { overflow-wrap: anywhere; }
    .brand-ai .sm-reasons__step { padding-bottom: 3rem; }
    .brand-ai .sm-reasons__step:last-child { padding-bottom: 0; }
    .brand-ai .sm-pricing .big-title,
    .brand-ai .sm-faq .big-title,
    .brand-ai .sm-reasons .big-title,
    .brand-ai .form-join .big-title { font-size: clamp(2.2rem, 5.4vw, 3rem); line-height: 1.2; text-wrap: balance; }
    .brand-ai .form-join-program { padding: 2rem 0; }
    .brand-ai .form-join-program__form-shell { padding: 24px !important; min-height: 0; }
    .brand-ai [data-shared-quote-home] { padding: 0 !important; }
    .brand-ai .forminator-input,
    .brand-ai .forminator-textarea,
    .brand-ai select { font-size: 16px !important; max-width: 100%; }
    .brand-ai .forminator-checkbox__label { overflow-wrap: anywhere; }
    .brand-ai .sm-testimonials__author > div { min-width: 0; }
}
@media (max-width: 430px) {
    .brand-ai .website-benefits__cta { padding: 16px 20px; font-size: 1.15rem; }
    .brand-ai .website-benefits__note { gap: 16px; }
    .brand-ai .website-benefits__note img { width: 64px; height: 64px; flex-basis: 64px; }
    .brand-ai .sm-testimonials__item { padding: 24px; }
    .brand-ai .form-join-program__form-shell { padding: 20px !important; }
}
@media (prefers-reduced-motion: reduce) {
    .brand-ai .sm-faq__icon, .brand-ai .sm-faq__answer p { transition: none; }
}
