/* Layout only: brand and controls use the homepage's shared stylesheets. */
html { scroll-behavior: smooth; scroll-padding-top: 115px; }
.campaign-page { color: #3c3c3b; background: #fff; }
.campaign-page .skip-link { position: fixed; top: -100px; left: 20px; z-index: 1100; padding: 12px 18px; background: #ffde51; color: #3c3c3b; }
.campaign-page .skip-link:focus { top: 15px; }
.campaign-page a:focus-visible, .campaign-page button:focus-visible, .campaign-page summary:focus-visible { outline: 3px solid #e83b39; outline-offset: 5px; }
.campaign-page .raul-hero::before { background-image: none; }
.campaign-hero { padding: 0 !important; }
.campaign-hero > .container { padding-top: 0; padding-bottom: 0; }
.campaign-hero .hero-title { max-width: 1200px; padding: 160px 0 0; font-size: clamp(58px, 8.2vw, 112px); line-height: 1.02 !important; }
.campaign-hero .hero-kicker { margin: 0 0 20px 5px; }
.campaign-hero .lead { max-width: 800px; margin: 34px 0 0; }
.campaign-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 32px; }
.campaign-hero-actions .services-overview-link { margin-top: 0; color: #fff; }
.campaign-hero-actions .services-overview-link:hover { color: #ffde51; }
.campaign-hero-note { max-width: 760px; margin: 18px 0 0; color: rgba(255,255,255,.56); font-size: 13px; line-height: 1.65; }
.campaign-hero .hero-capabilities { margin: 70px 0 75px; gap: 60px; }
.campaign-hero .hero-capability { border-top: 1px solid rgba(255,255,255,.2); padding-top: 24px; }
main .campaign-hero .hero-capability h2 { margin-bottom: 14px; }
.campaign-hero .hero-capability p { font-size: 16px; }
.campaign-overview .services-overview-intro { padding-right: 35px; }
.campaign-overview button.services-overview-link { padding: 0 0 7px; border: 0; border-bottom: 2px solid #e83b39; background: transparent; text-align: left; cursor: pointer; }
.campaign-overview .services-overview-intro h2 { font-size: clamp(38px, 4vw, 54px); line-height: 1.15; margin-bottom: 25px; }
.campaign-overview .service-overview-item { border-top: 1px solid #d7d7d3; margin: 0 24px 25px; padding: 26px 0 10px; }
.campaign-overview .service-overview-item:hover { transform: none; }
.campaign-overview .service-overview-item h3 { font-size: 23px; margin-bottom: 15px; }
.campaign-overview .service-overview-item p { max-width: none; font-size: 16px; line-height: 1.75; }
.campaign-number { display: block; margin-bottom: 22px; color: #e83b39; font-size: 12px; font-weight: 600; letter-spacing: .08em; }
.campaign-overview-note { margin: 30px 0 0; max-width: 900px; color: #666663; font-size: 14px; line-height: 1.75; }
.campaign-editorial { padding: 90px 0; background: #fff; }
.campaign-editorial-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: start; }
.campaign-editorial h2 { margin: 0; font-size: clamp(36px, 4vw, 54px); line-height: 1.12; font-weight: 700; letter-spacing: -.035em; color: #3c3c3b; }
.campaign-editorial-copy > p { margin-bottom: 24px; font-size: 18px; color: #666663; line-height: 1.75; }
.campaign-editorial-copy .campaign-cost-note { padding-left: 20px; border-left: 3px solid #e83b39; font-size: 14px; }
.campaign-process { padding: 85px 0 95px; background: #3c3c3b; color: #fff; }
.campaign-process h2 { margin: 0 0 45px; max-width: 850px; color: #fff; font-size: clamp(36px, 4vw, 54px); font-weight: 700; letter-spacing: -.035em; line-height: 1.15; }
.campaign-process .section-kicker { color: #ffde51; }
.campaign-process-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 60px; margin: 0; padding: 0; list-style: none; }
.campaign-process-grid li { border-top: 1px solid rgba(255,255,255,.2); padding-top: 24px; }
.campaign-process-grid .campaign-number { color: #ffde51; }
.campaign-process-grid h3 { color: #fff; font-size: 21px; font-weight: 500; line-height: 1.35; margin-bottom: 18px; }
.campaign-process-grid p { margin: 0; color: rgba(255,255,255,.65); font-size: 16px; line-height: 1.75; }
.campaign-contact { padding: 95px 0; background: #fff; }
.campaign-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: start; }
.campaign-contact h2 { margin: 0 0 24px; color: #3c3c3b; font-size: clamp(36px, 4vw, 54px); font-weight: 700; line-height: 1.12; letter-spacing: -.035em; }
.campaign-contact-intro { max-width: 430px; margin-bottom: 28px; color: #666663; font-size: 18px; line-height: 1.75; }
.campaign-contact .section-kicker { color: #e83b39; }
.campaign-contact-direct { margin-top: 24px; font-size: 14px; line-height: 1.75; }
.campaign-contact-direct a { color: #3c3c3b; text-decoration: underline; text-underline-offset: 4px; overflow-wrap: anywhere; }
.campaign-contact .contact-form-card { padding: 32px; box-shadow: none; border-color: #d7d7d3; }
.campaign-contact .contact-form-card h3 { color: #3c3c3b; font-size: 22px; font-weight: 600; margin-bottom: 24px; }
.campaign-contact .form-control { color: #3c3c3b; }
.campaign-contact .form-control:focus { border-color: #e83b39; }
.campaign-contact .optional { font-size: 10px; font-weight: 400; text-transform: none; letter-spacing: 0; }
.campaign-contact textarea { resize: vertical; }
.campaign-contact .form-note { margin: 16px 0 0; font-size: 12px; line-height: 1.6; color: #666663; }
.campaign-contact .form-response { margin: 20px 0 0; padding: 15px; background: #f4f4f2; border-radius: 6px; font-size: 14px; line-height: 1.65; }
.campaign-contact .form-response[data-state=error] { border-left: 3px solid #e83b39; }
.campaign-contact .form-response[data-state=success] { border-left: 3px solid #3c3c3b; }
.campaign-contact [aria-invalid=true] { border-color: #e83b39; }
.campaign-contact .contact-captcha { overflow: hidden; }

/* Ecommerce: a more spacious introduction, using the site's existing controls
   and the same capability icons as the homepage. */
[data-campaign="ecommerce"] .campaign-hero .hero-title { padding-top: 220px; }
[data-campaign="soporte-web"] .campaign-hero .hero-title { padding-top: 220px; }
[data-campaign="soporte-web"] .campaign-hero .lead { max-width: 920px; margin-top: 48px; font-size: 20px; line-height: 1.85; }
[data-campaign="soporte-web"] .campaign-hero-actions { margin-top: 42px; }
[data-campaign="soporte-web"] .campaign-hero-actions .btn { padding: 17px 30px; }
[data-campaign="soporte-web"] .campaign-hero .hero-capabilities { margin-top: 90px; margin-bottom: 100px; }
[data-campaign="soporte-web"] .campaign-hero .hero-capability { border-top: 0; padding-top: 0; }
[data-campaign="soporte-web"] .new-faq-list details p { max-width: none; }
.campaign-editorial-copy .campaign-sources { font-size: 14px; line-height: 1.9; }
.campaign-sources a { color: #3c3c3b; text-decoration: underline; text-underline-offset: 4px; }
[data-campaign="ecommerce"] .campaign-hero .lead { max-width: 920px; margin-top: 48px; font-size: 20px; line-height: 1.85; }
[data-campaign="ecommerce"] .campaign-hero-actions { margin-top: 42px; }
[data-campaign="ecommerce"] .campaign-hero-actions .btn { padding: 17px 30px; }
[data-campaign="ecommerce"] .campaign-hero .hero-capabilities { margin-top: 105px; margin-bottom: 110px; }
[data-campaign="ecommerce"] .campaign-hero .hero-capability { border-top: 0; padding-top: 0; }
[data-campaign="ecommerce"] .new-faq-list details p { max-width: none; }
@media (max-width: 991.98px) {
    .campaign-hero .hero-capabilities, .campaign-process-grid { gap: 30px; }
    .campaign-editorial-grid, .campaign-contact-grid { gap: 5%; }
    .campaign-contact .contact-form-card { padding: 25px; }
    .campaign-overview .services-overview-intro { padding-right: 15px; }
    .campaign-overview .service-overview-item { margin-inline: 15px; }
}
@media (max-width: 767.98px) {
    html { scroll-padding-top: 100px; }
    .campaign-hero .hero-title { padding-top: 135px; font-size: clamp(38px, 10vw, 66px); line-height: 1.04 !important; letter-spacing: .3px; }
    .campaign-hero .hero-kicker { margin-left: 0; font-size: 10px; }
    .campaign-hero .lead { margin-top: 25px; font-size: 16px; }
    .campaign-hero-actions { gap: 16px; margin-top: 27px; }
    .campaign-hero-note { font-size: 12px; }
    .campaign-hero .hero-capabilities { margin: 45px 0 50px; gap: 28px; }
    .campaign-hero .hero-capability p { max-width: none; font-size: 16px; }
    .campaign-overview .services-overview-intro { margin-top: 0; padding-inline: 0; }
    .campaign-overview .services-overview-grid { grid-template-columns: 1fr; }
    .campaign-overview .service-overview-item { margin-inline: 0; padding: 24px 0 10px; }
    .campaign-overview .services-overview-intro h2 { font-size: 38px; }
    .campaign-editorial, .campaign-contact { padding: 65px 0; }
    .campaign-editorial-grid, .campaign-contact-grid { grid-template-columns: 1fr; gap: 32px; }
    .campaign-editorial h2, .campaign-contact h2 { font-size: 38px; }
    .campaign-editorial-copy > p, .campaign-contact-intro { font-size: 16px; }
    .campaign-process { padding: 65px 0; }
    .campaign-process h2 { font-size: 38px; margin-bottom: 32px; }
    .campaign-process-grid { grid-template-columns: 1fr; gap: 30px; }
    .campaign-contact .contact-form-card { padding: 25px 20px; }
    .campaign-contact .form-control { font-size: 16px; }
    .campaign-contact .contact-actions .btn { margin-right: 0; }
    [data-campaign="ecommerce"] .campaign-hero .hero-title { padding-top: 175px; }
    [data-campaign="soporte-web"] .campaign-hero .hero-title { padding-top: 175px; }
    [data-campaign="soporte-web"] .campaign-hero .lead { margin-top: 32px; font-size: 17px; line-height: 1.8; }
    [data-campaign="soporte-web"] .campaign-hero-actions { margin-top: 32px; }
    [data-campaign="soporte-web"] .campaign-hero .hero-capabilities { margin-top: 70px; margin-bottom: 75px; gap: 44px; }
    [data-campaign="ecommerce"] .campaign-hero .lead { margin-top: 32px; font-size: 17px; line-height: 1.8; }
    [data-campaign="ecommerce"] .campaign-hero-actions { margin-top: 32px; }
    [data-campaign="ecommerce"] .campaign-hero .hero-capabilities { margin-top: 70px; margin-bottom: 75px; gap: 44px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .campaign-page main *, .campaign-page main *::before, .campaign-page main *::after { transition: none !important; animation: none !important; }
}
