@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500&display=swap');

@layer reset, tokens, layout, components, utilities;

@layer reset {
  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: hidden; }
  body { min-height: 100vh; display: flex; flex-direction: column; }
  img { max-width: 100%; height: auto; display: block; }
  ul { list-style: none; }
  a { text-decoration: none; color: inherit; }
  button { cursor: pointer; border: none; background: none; font: inherit; }
  address { font-style: normal; }
  input, textarea, select { font: inherit; }
  table { border-collapse: collapse; width: 100%; }
}

@layer tokens {
  :root {
    --clr-bg: #f5f3ef;
    --clr-bg-alt: #edeae4;
    --clr-bg-dark: #1a2332;
    --clr-bg-darker: #111820;
    --clr-pri: #2a6b5a;
    --clr-pri-light: #3d8f76;
    --clr-pri-dark: #1d4d3f;
    --clr-acc: #c8873a;
    --clr-acc-light: #e09a4f;
    --clr-txt: #1e2d22;
    --clr-txt-muted: #5a6b60;
    --clr-txt-light: #f0ede8;
    --clr-txt-lighter: #c8c4bc;
    --clr-border: #d4cfc7;
    --clr-border-light: #e8e4de;
    --clr-white: #faf9f7;

    --ff-head: 'Fraunces', Georgia, serif;
    --ff-body: 'Inter', system-ui, sans-serif;

    --fz-xs: clamp(0.75rem, 1.5vw, 0.8125rem);
    --fz-sm: clamp(0.875rem, 1.8vw, 0.9375rem);
    --fz-base: clamp(1rem, 2vw, 1.0625rem);
    --fz-md: clamp(1.125rem, 2.2vw, 1.25rem);
    --fz-lg: clamp(1.25rem, 2.5vw, 1.5rem);
    --fz-xl: clamp(1.5rem, 3vw, 2rem);
    --fz-2xl: clamp(2rem, 4vw, 2.75rem);
    --fz-3xl: clamp(2.5rem, 6vw, 4rem);
    --fz-hero: clamp(3rem, 8vw, 6rem);

    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.25rem;
    --sp-6: 1.5rem;
    --sp-8: 2rem;
    --sp-10: 2.5rem;
    --sp-12: 3rem;
    --sp-16: 4rem;
    --sp-20: 5rem;
    --sp-24: 6rem;
    --sp-32: 8rem;

    --rad-sm: 4px;
    --rad-md: 10px;
    --rad-lg: 18px;
    --rad-xl: 28px;
    --rad-full: 9999px;

    --shadow-sm: 0 1px 3px rgba(26,35,50,0.06), 0 1px 2px rgba(26,35,50,0.04);
    --shadow-md: 0 4px 12px rgba(26,35,50,0.08), 0 2px 6px rgba(26,35,50,0.05);
    --shadow-lg: 0 8px 28px rgba(26,35,50,0.10), 0 4px 12px rgba(26,35,50,0.06);
    --shadow-xl: 0 16px 48px rgba(26,35,50,0.12), 0 8px 24px rgba(26,35,50,0.08);
    --shadow-pri: 0 8px 24px rgba(42,107,90,0.25), 0 2px 8px rgba(42,107,90,0.15);
    --shadow-acc: 0 8px 24px rgba(200,135,58,0.25), 0 2px 8px rgba(200,135,58,0.15);

    --trans-fast: 150ms ease;
    --trans-base: 250ms ease;
    --trans-slow: 400ms ease;
    --trans-spring: 350ms cubic-bezier(0.34, 1.56, 0.64, 1);

    --nav-h: 72px;
  }
}

@layer layout {
  body {
    font-family: var(--ff-body);
    font-size: var(--fz-base);
    color: var(--clr-txt);
    background-color: var(--clr-bg);
    line-height: 1.7;
  }

  .wrap {
    width: min(1200px, 100% - 3rem);
    margin-inline: auto;
  }

  .sec {
    padding-block: var(--sp-20) var(--sp-24);
  }

  .sec-alt {
    background-color: var(--clr-bg-alt);
  }

  main, .legal-pg, .thanks-main, .pg-hero ~ .sec {
    flex: 1;
  }
}

@layer components {

  
  .hdr {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 900;
    transition: background-color var(--trans-base), box-shadow var(--trans-base), backdrop-filter var(--trans-base);
  }

  .hdr.hdr-transparent {
    background-color: transparent;
  }

  .hdr.hdr-solid, .hdr.scrolled {
    background-color: var(--clr-white);
    box-shadow: var(--shadow-md);
  }

  .hdr-nav {
    display: flex;
    align-items: center;
    gap: var(--sp-6);
    height: var(--nav-h);
    padding-inline: var(--sp-6);
    max-width: 1280px;
    margin-inline: auto;
  }

  .hdr-logo { display: flex; align-items: center; flex-shrink: 0; }
  .hdr-logo-img { height: 36px; width: auto; }

  .hdr-links {
    display: none;
    gap: var(--sp-1);
    margin-left: auto;
  }

  .hdr-link {
    font-size: var(--fz-sm);
    font-weight: 500;
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--rad-sm);
    color: var(--clr-txt-light);
    position: relative;
    transition: color var(--trans-base);
  }

  .hdr.scrolled .hdr-link,
  .hdr.hdr-solid .hdr-link {
    color: var(--clr-txt);
  }

  .hdr-link::after {
    content: '';
    position: absolute;
    bottom: 2px; left: var(--sp-3); right: var(--sp-3);
    height: 2px;
    background: var(--clr-pri);
    border-radius: var(--rad-full);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--trans-base);
  }

  .hdr-link:hover::after, .hdr-link.active::after { transform: scaleX(1); }
  .hdr-link:hover { color: var(--clr-pri); }
  .hdr.scrolled .hdr-link.active, .hdr.hdr-solid .hdr-link.active { color: var(--clr-pri); }

  .hdr-cta { display: none; }

  .hdr-burger {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: var(--sp-3);
    margin-left: auto;
    border-radius: var(--rad-sm);
    transition: background-color var(--trans-fast);
  }

  .hdr-burger:hover { background-color: rgba(255,255,255,0.1); }
  .hdr.scrolled .hdr-burger:hover,
  .hdr.hdr-solid .hdr-burger:hover { background-color: var(--clr-bg-alt); }

  .hdr-burger span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--clr-txt-light);
    border-radius: var(--rad-full);
    transition: background-color var(--trans-base), transform var(--trans-base), opacity var(--trans-base);
  }

  .hdr.scrolled .hdr-burger span,
  .hdr.hdr-solid .hdr-burger span { background: var(--clr-txt); }

  .hdr-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .hdr-burger.open span:nth-child(2) { opacity: 0; }
  .hdr-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  
  .mob-sheet {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 1000;
    transform: translateY(100%);
    transition: transform var(--trans-slow) cubic-bezier(0.32, 0.72, 0, 1);
    pointer-events: none;
  }

  .mob-sheet.open {
    transform: translateY(0);
    pointer-events: all;
  }

  .mob-sheet-inner {
    background: var(--clr-white);
    border-radius: var(--rad-xl) var(--rad-xl) 0 0;
    padding: var(--sp-4) var(--sp-6) var(--sp-8);
    box-shadow: 0 -8px 40px rgba(26,35,50,0.18);
  }

  .mob-drag {
    width: 36px;
    height: 4px;
    background: var(--clr-border);
    border-radius: var(--rad-full);
    margin: 0 auto var(--sp-6);
  }

  .mob-nav { display: flex; flex-direction: column; gap: var(--sp-2); margin-bottom: var(--sp-6); }

  .mob-link {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-4) var(--sp-4);
    border-radius: var(--rad-md);
    font-size: var(--fz-md);
    font-weight: 500;
    color: var(--clr-txt);
    transition: background-color var(--trans-fast), color var(--trans-fast), transform var(--trans-fast);
    min-height: 52px;
  }

  .mob-link i { width: 20px; color: var(--clr-pri); }
  .mob-link:hover { background-color: var(--clr-bg-alt); color: var(--clr-pri); transform: translateX(4px); }

  .mob-cta { display: block; text-align: center; }

  .mob-overlay {
    position: fixed;
    inset: 0;
    background: rgba(17,24,32,0.5);
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--trans-slow);
    backdrop-filter: blur(2px);
  }

  .mob-overlay.open { opacity: 1; pointer-events: all; }

  
  .btn-pri {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: 0.625rem 1.375rem;
    background: var(--clr-pri);
    color: var(--clr-white);
    font-weight: 500;
    font-size: var(--fz-sm);
    border-radius: var(--rad-full);
    box-shadow: var(--shadow-pri);
    transition: background-color var(--trans-base), transform var(--trans-spring), box-shadow var(--trans-base);
    white-space: nowrap;
  }

  .btn-pri:hover {
    background: var(--clr-pri-light);
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(42,107,90,0.32), 0 4px 12px rgba(42,107,90,0.18);
  }

  .btn-pri:active { transform: translateY(0); }

  .btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: 0.625rem 1.375rem;
    border: 1.5px solid rgba(255,255,255,0.45);
    color: var(--clr-white);
    font-weight: 500;
    font-size: var(--fz-sm);
    border-radius: var(--rad-full);
    transition: border-color var(--trans-base), background-color var(--trans-base), transform var(--trans-spring);
    white-space: nowrap;
  }

  .btn-ghost:hover {
    border-color: rgba(255,255,255,0.9);
    background-color: rgba(255,255,255,0.12);
    transform: translateY(-2px);
  }

  .btn-sec {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: 0.625rem 1.375rem;
    border: 1.5px solid var(--clr-pri);
    color: var(--clr-pri);
    font-weight: 500;
    font-size: var(--fz-sm);
    border-radius: var(--rad-full);
    transition: background-color var(--trans-base), color var(--trans-base), transform var(--trans-spring), box-shadow var(--trans-base);
  }

  .btn-sec:hover {
    background: var(--clr-pri);
    color: var(--clr-white);
    transform: translateY(-2px);
    box-shadow: var(--shadow-pri);
  }

  .btn-lg {
    padding: 0.875rem 2rem;
    font-size: var(--fz-base);
  }

  .btn-full { width: 100%; justify-content: center; }

  
  .hero {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: center;
    overflow: hidden;
  }

  .hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
  }

  .hero-img {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      135deg,
      rgba(17,24,32,0.72) 0%,
      rgba(26,35,50,0.55) 50%,
      rgba(17,24,32,0.40) 100%
    );
  }

  .hero-cnt {
    position: relative;
    z-index: 1;
    width: min(860px, 100% - 3rem);
    margin-inline: auto;
    padding-top: var(--nav-h);
    padding-block: calc(var(--nav-h) + var(--sp-16)) var(--sp-20);
  }

  .hero-eyebrow {
    font-size: var(--fz-sm);
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--clr-acc-light);
    margin-bottom: var(--sp-4);
  }

  .hero-h1 {
    font-family: var(--ff-head);
    font-size: var(--fz-hero);
    font-weight: 700;
    line-height: 1.08;
    color: var(--clr-white);
    margin-bottom: var(--sp-6);
  }

  .hero-typed-wrap {
    display: block;
    color: var(--clr-acc-light);
    min-height: 1.1em;
  }

  .hero-sub {
    font-size: var(--fz-md);
    color: rgba(240,237,232,0.85);
    max-width: 600px;
    line-height: 1.75;
    margin-bottom: var(--sp-10);
  }

  .hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
    align-items: center;
  }

  .hero-scroll-hint {
    position: absolute;
    bottom: var(--sp-8);
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255,255,255,0.5);
    font-size: 1.25rem;
    animation: bounceY 2s ease-in-out infinite;
    z-index: 1;
  }

  @keyframes bounceY {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(8px); }
  }

  
  .pg-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
  }

  .pg-hero-sm { min-height: 52vh; }

  .pg-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
  }

  .pg-hero-grad {
    width: 100%; height: 100%;
    background: linear-gradient(135deg, var(--clr-bg-dark) 0%, var(--clr-pri-dark) 100%);
  }

  .pg-hero-img {
    width: 100%; height: 100%;
    object-fit: cover;
  }

  .pg-hero-cnt {
    position: relative;
    z-index: 1;
    padding-top: calc(var(--nav-h) + var(--sp-16));
    padding-bottom: var(--sp-16);
  }

  .pg-hero-h1 {
    font-family: var(--ff-head);
    font-size: var(--fz-3xl);
    font-weight: 700;
    color: var(--clr-white);
    line-height: 1.15;
    margin-bottom: var(--sp-4);
  }

  .pg-hero-sub {
    font-size: var(--fz-md);
    color: rgba(240,237,232,0.82);
    max-width: 580px;
    line-height: 1.75;
  }

  
  .sec-eyebrow {
    font-size: var(--fz-xs);
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--clr-pri);
    margin-bottom: var(--sp-3);
  }

  .sec-title {
    font-family: var(--ff-head);
    font-size: var(--fz-2xl);
    font-weight: 700;
    color: var(--clr-txt);
    line-height: 1.2;
    margin-bottom: var(--sp-8);
  }

  .sec-intro {
    font-size: var(--fz-md);
    color: var(--clr-txt-muted);
    max-width: 680px;
    line-height: 1.8;
    margin-bottom: var(--sp-12);
  }

  .sec-intro-lg {
    font-family: var(--ff-head);
    font-size: var(--fz-xl);
    font-weight: 500;
    color: var(--clr-txt);
    line-height: 1.55;
    max-width: 800px;
    margin-bottom: var(--sp-16);
  }

  
  .crd {
    background: var(--clr-white);
    border-radius: var(--rad-lg);
    border: 1.5px solid var(--clr-border-light);
    padding: var(--sp-8);
    transition: transform var(--trans-spring), box-shadow var(--trans-base), border-color var(--trans-base);
  }

  .crd:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl), 0 0 0 1px rgba(42,107,90,0.08);
    border-color: var(--clr-pri);
  }

  .crd-ico {
    width: 52px; height: 52px;
    background: linear-gradient(135deg, var(--clr-pri), var(--clr-pri-light));
    border-radius: var(--rad-md);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem;
    color: var(--clr-white);
    margin-bottom: var(--sp-5);
    box-shadow: var(--shadow-pri);
    transition: transform var(--trans-spring), box-shadow var(--trans-base);
  }

  .crd:hover .crd-ico {
    transform: scale(1.08) rotate(-3deg);
    box-shadow: 0 10px 28px rgba(42,107,90,0.3);
  }

  .crd-ttl {
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 600;
    color: var(--clr-txt);
    margin-bottom: var(--sp-3);
    line-height: 1.3;
  }

  .crd-txt {
    font-size: var(--fz-sm);
    color: var(--clr-txt-muted);
    line-height: 1.75;
  }

  
  .ben-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--sp-6);
    margin-top: var(--sp-12);
  }

  
  .divider-wave {
    line-height: 0;
    overflow: hidden;
    background: var(--clr-bg);
  }

  .divider-wave svg { display: block; }

  .divider-dots {
    padding-block: var(--sp-8);
    display: flex;
    justify-content: center;
    background: var(--clr-bg);
  }

  .dot-row {
    width: 200px;
    height: 20px;
    background-image: radial-gradient(circle, var(--clr-pri) 2px, transparent 2px);
    background-size: 20px 20px;
    opacity: 0.35;
  }

  .sec-alt .divider-dots { background: var(--clr-bg-alt); }

  
  .acc-list { display: flex; flex-direction: column; gap: var(--sp-3); }

  .acc-item {
    background: var(--clr-white);
    border-radius: var(--rad-lg);
    border: 1.5px solid var(--clr-border-light);
    overflow: hidden;
    transition: box-shadow var(--trans-base), border-color var(--trans-base);
  }

  .acc-item:hover { box-shadow: var(--shadow-md); border-color: var(--clr-border); }
  .acc-item.open { border-color: var(--clr-pri); box-shadow: var(--shadow-lg); }

  .acc-hdr {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    width: 100%;
    padding: var(--sp-5) var(--sp-6);
    text-align: left;
    transition: background-color var(--trans-fast);
    min-height: 64px;
  }

  .acc-hdr:hover { background-color: var(--clr-bg-alt); }
  .acc-item.open .acc-hdr { background-color: rgba(42,107,90,0.04); }

  .acc-ico {
    width: 40px; height: 40px;
    background: linear-gradient(135deg, var(--clr-pri), var(--clr-pri-light));
    border-radius: var(--rad-md);
    display: flex; align-items: center; justify-content: center;
    color: var(--clr-white);
    font-size: 1rem;
    flex-shrink: 0;
    transition: transform var(--trans-spring);
  }

  .acc-item.open .acc-ico { transform: scale(1.05); }

  .acc-label {
    font-family: var(--ff-head);
    font-size: var(--fz-md);
    font-weight: 600;
    color: var(--clr-txt);
    flex: 1;
  }

  .acc-arr {
    color: var(--clr-txt-muted);
    font-size: 0.875rem;
    flex-shrink: 0;
    transition: transform var(--trans-base), color var(--trans-base);
  }

  .acc-item.open .acc-arr { transform: rotate(180deg); color: var(--clr-pri); }

  .acc-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .acc-item.open .acc-body { max-height: 800px; }

  .acc-inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-6);
    padding: var(--sp-6);
    border-top: 1px solid var(--clr-border-light);
  }

  .acc-inner-txt { grid-template-columns: 1fr; }

  .acc-media img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    border-radius: var(--rad-md);
  }

  .acc-text p { color: var(--clr-txt-muted); line-height: 1.8; margin-bottom: var(--sp-4); }
  .acc-text p:last-child { margin-bottom: 0; }

  
  .zona-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-12);
    align-items: center;
  }

  .zona-txt .sec-title { margin-bottom: var(--sp-5); }
  .zona-txt p { color: var(--clr-txt-muted); line-height: 1.8; margin-bottom: var(--sp-4); }
  .zona-txt p:last-of-type { margin-bottom: var(--sp-8); }

  .zona-img img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: var(--rad-xl);
    box-shadow: var(--shadow-xl);
    transition: transform var(--trans-slow), box-shadow var(--trans-slow);
  }

  .zona-img img:hover {
    transform: scale(1.02);
    box-shadow: 0 24px 64px rgba(26,35,50,0.16);
  }

  
  .faq-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-4);
    margin-top: var(--sp-10);
  }

  .crd-faq {
    padding: 0;
    overflow: hidden;
  }

  .faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    width: 100%;
    padding: var(--sp-5) var(--sp-6);
    text-align: left;
    font-size: var(--fz-base);
    font-weight: 500;
    color: var(--clr-txt);
    min-height: 56px;
    transition: color var(--trans-fast), background-color var(--trans-fast);
  }

  .faq-q:hover { color: var(--clr-pri); background-color: rgba(42,107,90,0.03); }

  .faq-icon {
    flex-shrink: 0;
    font-size: 0.875rem;
    color: var(--clr-pri);
    transition: transform var(--trans-base);
  }

  .crd-faq.faq-open .faq-icon { transform: rotate(45deg); }

  .faq-a {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .crd-faq.faq-open .faq-a { max-height: 300px; }

  .faq-a p {
    padding: 0 var(--sp-6) var(--sp-5);
    color: var(--clr-txt-muted);
    font-size: var(--fz-sm);
    line-height: 1.8;
    border-top: 1px solid var(--clr-border-light);
    padding-top: var(--sp-4);
  }

  
  .sec-cta-band {
    background: linear-gradient(135deg, var(--clr-bg-dark) 0%, var(--clr-pri-dark) 100%);
    padding-block: var(--sp-16) var(--sp-20);
  }

  .cta-band {
    display: flex;
    flex-direction: column;
    gap: var(--sp-8);
    align-items: flex-start;
  }

  .cta-band-h2 {
    font-family: var(--ff-head);
    font-size: var(--fz-2xl);
    font-weight: 700;
    color: var(--clr-white);
    line-height: 1.2;
    margin-bottom: var(--sp-3);
  }

  .cta-band p {
    color: rgba(240,237,232,0.78);
    font-size: var(--fz-md);
    max-width: 520px;
    line-height: 1.75;
  }

  
  .dif-intro { margin-bottom: var(--sp-16); }

  .dif-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--sp-6);
  }

  .crd-dif {
    position: relative;
    padding-top: var(--sp-10);
  }

  .crd-dif-num {
    position: absolute;
    top: var(--sp-6);
    right: var(--sp-6);
    font-family: var(--ff-head);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--clr-border);
    line-height: 1;
    transition: color var(--trans-base);
  }

  .crd-dif:hover .crd-dif-num { color: rgba(42,107,90,0.15); }

  
  .proceso-steps {
    display: flex;
    flex-direction: column;
    gap: var(--sp-6);
    margin-top: var(--sp-12);
    position: relative;
  }

  .proceso-steps::before {
    content: '';
    position: absolute;
    left: 28px;
    top: 48px;
    bottom: 48px;
    width: 2px;
    background: linear-gradient(to bottom, var(--clr-pri), transparent);
    opacity: 0.3;
  }

  .step {
    display: flex;
    gap: var(--sp-6);
    align-items: flex-start;
    background: var(--clr-white);
    border-radius: var(--rad-lg);
    border: 1.5px solid var(--clr-border-light);
    padding: var(--sp-6);
    transition: transform var(--trans-spring), box-shadow var(--trans-base), border-color var(--trans-base);
  }

  .step:hover {
    transform: translateX(6px);
    box-shadow: var(--shadow-lg);
    border-color: var(--clr-pri);
  }

  .step-num {
    width: 48px; height: 48px;
    background: linear-gradient(135deg, var(--clr-pri), var(--clr-pri-light));
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 700;
    color: var(--clr-white);
    flex-shrink: 0;
    box-shadow: var(--shadow-pri);
  }

  .step-cnt h3 {
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 600;
    color: var(--clr-txt);
    margin-bottom: var(--sp-2);
  }

  .step-cnt p { color: var(--clr-txt-muted); line-height: 1.75; }

  
  .img-feature-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-12);
    align-items: center;
  }

  .img-feature-img img {
    width: 100%;
    height: 380px;
    object-fit: cover;
    border-radius: var(--rad-xl);
    box-shadow: var(--shadow-xl);
    transition: transform var(--trans-slow), box-shadow var(--trans-slow);
  }

  .img-feature-img img:hover {
    transform: scale(1.02) rotate(-0.5deg);
    box-shadow: 0 24px 64px rgba(26,35,50,0.16);
  }

  .img-feature-txt .sec-title { margin-bottom: var(--sp-5); }
  .img-feature-txt p { color: var(--clr-txt-muted); line-height: 1.8; margin-bottom: var(--sp-4); }
  .img-feature-txt p:last-of-type { margin-bottom: var(--sp-8); }

  
  .factor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--sp-6);
    margin-top: var(--sp-12);
  }

  .crd-factor { text-align: center; }
  .crd-factor .crd-ico { margin-inline: auto; }

  
  .tarifa-acc { display: flex; flex-direction: column; gap: var(--sp-3); }

  
  .sec-presupuesto-cta {
    background: linear-gradient(135deg, var(--clr-bg-dark) 0%, var(--clr-pri-dark) 100%);
    padding-block: var(--sp-20);
  }

  .pres-cta-grid {
    display: flex;
    flex-direction: column;
    gap: var(--sp-10);
  }

  .pres-cta-txt .sec-title { color: var(--clr-white); margin-bottom: var(--sp-4); }
  .pres-cta-txt p { color: rgba(240,237,232,0.8); line-height: 1.8; margin-bottom: var(--sp-3); }

  .pres-cta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
  }

  
  .host-intro { margin-bottom: var(--sp-16); }

  .host-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--sp-6);
    margin-top: var(--sp-12);
  }

  .inst-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--sp-6);
    margin-top: var(--sp-12);
  }

  .crd-inst { padding: 0; overflow: hidden; }

  .inst-img img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    transition: transform var(--trans-slow);
  }

  .crd-inst:hover .inst-img img { transform: scale(1.05); }

  .inst-body { padding: var(--sp-6); }

  .inst-body h3 {
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 600;
    color: var(--clr-txt);
    margin-bottom: var(--sp-3);
  }

  .inst-body p { color: var(--clr-txt-muted); font-size: var(--fz-sm); line-height: 1.75; }

  .sec-host-cta {
    background: linear-gradient(135deg, var(--clr-pri-dark) 0%, var(--clr-bg-dark) 100%);
    padding-block: var(--sp-20);
  }

  .host-cta-inner { text-align: center; max-width: 620px; margin-inline: auto; }
  .host-cta-inner .sec-eyebrow { color: var(--clr-acc-light); }
  .host-cta-inner .sec-title { color: var(--clr-white); }
  .host-cta-inner p { color: rgba(240,237,232,0.8); line-height: 1.8; margin-bottom: var(--sp-10); }

  .host-cta-btns {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
    justify-content: center;
  }

  
  .sec-contact { padding-top: var(--sp-16); }

  .contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-16);
  }

  .contact-info .sec-title { margin-bottom: var(--sp-8); }

  .contact-items { display: flex; flex-direction: column; gap: var(--sp-5); margin-bottom: var(--sp-8); }

  .contact-item {
    display: flex;
    gap: var(--sp-4);
    align-items: flex-start;
    padding: var(--sp-4);
    border-radius: var(--rad-md);
    border: 1.5px solid var(--clr-border-light);
    transition: border-color var(--trans-base), box-shadow var(--trans-base), transform var(--trans-spring);
  }

  .contact-item:hover {
    border-color: var(--clr-pri);
    box-shadow: var(--shadow-md);
    transform: translateX(4px);
  }

  .contact-ico {
    width: 42px; height: 42px;
    background: linear-gradient(135deg, var(--clr-pri), var(--clr-pri-light));
    border-radius: var(--rad-md);
    display: flex; align-items: center; justify-content: center;
    color: var(--clr-white);
    flex-shrink: 0;
    font-size: 1rem;
  }

  .contact-lbl { font-size: var(--fz-xs); font-weight: 500; text-transform: uppercase; letter-spacing: 0.08em; color: var(--clr-txt-muted); margin-bottom: var(--sp-1); }
  .contact-val { font-size: var(--fz-sm); color: var(--clr-txt); font-weight: 500; transition: color var(--trans-fast); }
  a.contact-val:hover { color: var(--clr-pri); }

  
  .frm { display: flex; flex-direction: column; gap: var(--sp-5); }

  .frm-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-5);
  }

  .frm-grp { display: flex; flex-direction: column; gap: var(--sp-2); }

  .frm-lbl {
    font-size: var(--fz-sm);
    font-weight: 500;
    color: var(--clr-txt);
  }

  .req { color: var(--clr-pri); }

  .frm-inp {
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--clr-border);
    border-radius: var(--rad-md);
    background: var(--clr-white);
    color: var(--clr-txt);
    font-size: var(--fz-base);
    transition: border-color var(--trans-base), box-shadow var(--trans-base);
    min-height: 44px;
  }

  .frm-inp:focus {
    outline: none;
    border-color: var(--clr-pri);
    box-shadow: 0 0 0 3px rgba(42,107,90,0.12);
  }

  .frm-inp::placeholder { color: var(--clr-txt-muted); opacity: 0.65; }

  .frm-ta { resize: vertical; min-height: 140px; }

  .frm-check { flex-direction: row; align-items: flex-start; }

  .frm-check-lbl {
    display: flex;
    gap: var(--sp-3);
    align-items: flex-start;
    font-size: var(--fz-sm);
    color: var(--clr-txt-muted);
    cursor: pointer;
    line-height: 1.6;
  }

  .frm-check-lbl input {
    margin-top: 3px;
    width: 18px; height: 18px;
    flex-shrink: 0;
    accent-color: var(--clr-pri);
    cursor: pointer;
  }

  .frm-check-lbl a { color: var(--clr-pri); text-decoration: underline; }

  
  .sec-urgent { padding-block: var(--sp-16) var(--sp-20); }

  .urgent-inner {
    display: flex;
    flex-direction: column;
    gap: var(--sp-6);
    align-items: flex-start;
    background: var(--clr-white);
    border-radius: var(--rad-xl);
    border: 1.5px solid var(--clr-border-light);
    padding: var(--sp-10);
    box-shadow: var(--shadow-md);
    transition: box-shadow var(--trans-base), border-color var(--trans-base);
  }

  .urgent-inner:hover { box-shadow: var(--shadow-xl); border-color: var(--clr-acc); }

  .urgent-ico {
    width: 56px; height: 56px;
    background: linear-gradient(135deg, var(--clr-acc), var(--clr-acc-light));
    border-radius: var(--rad-lg);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
    color: var(--clr-white);
    box-shadow: var(--shadow-acc);
  }

  .urgent-h2 {
    font-family: var(--ff-head);
    font-size: var(--fz-xl);
    font-weight: 700;
    color: var(--clr-txt);
    margin-bottom: var(--sp-3);
  }

  .urgent-txt p { color: var(--clr-txt-muted); line-height: 1.8; margin-bottom: var(--sp-2); }

  .urgent-btn {
    background: var(--clr-acc);
    box-shadow: var(--shadow-acc);
  }

  .urgent-btn:hover {
    background: var(--clr-acc-light);
    box-shadow: 0 12px 32px rgba(200,135,58,0.32);
  }

  
  .thanks-pg { background: var(--clr-bg); }

  .thanks-main {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-20) var(--sp-6);
    padding-top: calc(var(--nav-h) + var(--sp-16));
  }

  .thanks-inner {
    text-align: center;
    max-width: 480px;
  }

  .envelope-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: var(--sp-10);
  }

  .envelope {
    position: relative;
    width: 100px;
    height: 72px;
  }

  .env-body {
    position: absolute;
    inset: 0;
    background: var(--clr-pri);
    border-radius: var(--rad-sm);
    box-shadow: var(--shadow-pri);
  }

  .env-body::before {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 36px;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.1));
    border-radius: 0 0 var(--rad-sm) var(--rad-sm);
  }

  .env-flap {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-top: 40px solid var(--clr-pri-dark);
    transform-origin: top center;
    animation: flapOpen 0.6s 0.5s ease-out forwards;
  }

  @keyframes flapOpen {
    0% { transform: rotateX(0deg); }
    100% { transform: rotateX(-160deg); }
  }

  .env-letter {
    position: absolute;
    left: 12px; right: 12px;
    bottom: 8px;
    height: 50px;
    background: var(--clr-white);
    border-radius: var(--rad-sm);
    padding: var(--sp-2);
    transform: translateY(0);
    animation: letterRise 0.5s 0.9s ease-out forwards;
    opacity: 0;
  }

  @keyframes letterRise {
    0% { transform: translateY(20px); opacity: 0; }
    100% { transform: translateY(-28px); opacity: 1; }
  }

  .env-letter-lines { display: flex; flex-direction: column; gap: 5px; padding-top: 4px; }

  .env-letter-lines span {
    display: block;
    height: 2px;
    background: var(--clr-border);
    border-radius: var(--rad-full);
  }

  .env-letter-lines span:first-child { width: 60%; }
  .env-letter-lines span:nth-child(2) { width: 90%; }
  .env-letter-lines span:last-child { width: 75%; }

  .thanks-h1 {
    font-family: var(--ff-head);
    font-size: var(--fz-2xl);
    font-weight: 700;
    color: var(--clr-txt);
    margin-bottom: var(--sp-4);
    animation: fadeInUp 0.5s 1.2s ease-out both;
  }

  .thanks-p {
    color: var(--clr-txt-muted);
    font-size: var(--fz-md);
    line-height: 1.75;
    margin-bottom: var(--sp-8);
    animation: fadeInUp 0.5s 1.4s ease-out both;
  }

  .thanks-inner .btn-pri {
    animation: fadeInUp 0.5s 1.6s ease-out both;
  }

  @keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }

  
  .sidebar-cta {
    position: fixed;
    right: var(--sp-5);
    top: 50%;
    transform: translateY(-50%);
    z-index: 800;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .sidebar-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-4) var(--sp-3);
    background: var(--clr-pri);
    color: var(--clr-white);
    border-radius: var(--rad-lg);
    box-shadow: var(--shadow-pri);
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-size: var(--fz-xs);
    font-weight: 500;
    letter-spacing: 0.06em;
    transition: background-color var(--trans-base), transform var(--trans-spring), box-shadow var(--trans-base);
    writing-mode: horizontal-tb;
    writing-mode: initial;
  }

  .sidebar-btn { writing-mode: vertical-lr; }
  .sidebar-btn i { font-size: 1.1rem; }
  .sidebar-lbl { font-size: 0.65rem; letter-spacing: 0.05em; text-transform: uppercase; }

  .sidebar-btn:hover {
    background: var(--clr-pri-light);
    transform: translateY(-50%) scale(1.06) translateX(-3px);
    box-shadow: 0 12px 32px rgba(42,107,90,0.32);
  }

  
  .ftr {
    background: var(--clr-bg-darker);
    color: var(--clr-txt-lighter);
    padding-top: var(--sp-16);
    margin-top: auto;
  }

  .ftr-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-10);
    padding-bottom: var(--sp-12);
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }

  .ftr-logo { height: 32px; width: auto; margin-bottom: var(--sp-4); }

  .ftr-tagline { font-size: var(--fz-sm); line-height: 1.7; color: rgba(200,196,188,0.7); max-width: 280px; }

  .ftr-h4 {
    font-size: var(--fz-xs);
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--clr-txt-lighter);
    margin-bottom: var(--sp-4);
  }

  .ftr-links { display: flex; flex-direction: column; gap: var(--sp-2); }

  .ftr-links a {
    font-size: var(--fz-sm);
    color: rgba(200,196,188,0.7);
    transition: color var(--trans-base), transform var(--trans-fast);
    display: inline-block;
    position: relative;
  }

  .ftr-links a::after {
    content: '';
    position: absolute;
    bottom: -1px; left: 0; right: 100%;
    height: 1px;
    background: var(--clr-acc-light);
    transition: right var(--trans-base);
  }

  .ftr-links a:hover { color: var(--clr-white); transform: translateX(3px); }
  .ftr-links a:hover::after { right: 0; }

  .ftr-address p {
    font-size: var(--fz-sm);
    color: rgba(200,196,188,0.7);
    line-height: 1.75;
    margin-bottom: var(--sp-3);
    display: flex;
    gap: var(--sp-2);
    align-items: flex-start;
  }

  .ftr-address i { color: var(--clr-pri-light); margin-top: 3px; flex-shrink: 0; }

  .ftr-address a { transition: color var(--trans-fast); }
  .ftr-address a:hover { color: var(--clr-white); }

  .ftr-bottom {
    padding-block: var(--sp-5);
    text-align: center;
    font-size: var(--fz-xs);
    color: rgba(200,196,188,0.45);
  }

  
  .legal-pg {
    padding-top: calc(var(--nav-h) + var(--sp-12));
    padding-bottom: var(--sp-20);
    flex: 1;
  }

  .legal-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--sp-12);
  }

  .legal-side { display: none; }

  .legal-nav-ttl {
    font-size: var(--fz-xs);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--clr-txt-muted);
    margin-bottom: var(--sp-4);
  }

  .legal-nav { display: flex; flex-direction: column; gap: var(--sp-1); }

  .legal-nav-lnk {
    font-size: var(--fz-sm);
    color: var(--clr-txt-muted);
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--rad-sm);
    border-left: 2px solid transparent;
    transition: color var(--trans-fast), border-color var(--trans-fast), background-color var(--trans-fast);
    display: block;
  }

  .legal-nav-lnk:hover {
    color: var(--clr-pri);
    border-color: var(--clr-pri);
    background-color: rgba(42,107,90,0.05);
  }

  .legal-updated {
    font-size: var(--fz-xs);
    color: var(--clr-txt-muted);
    margin-bottom: var(--sp-4);
  }

  .legal-h1 {
    font-family: var(--ff-head);
    font-size: var(--fz-2xl);
    font-weight: 700;
    color: var(--clr-txt);
    margin-bottom: var(--sp-8);
  }

  .legal-body section {
    margin-bottom: var(--sp-10);
    padding-bottom: var(--sp-8);
    border-bottom: 1px solid var(--clr-border-light);
  }

  .legal-body section:last-child { border-bottom: none; }

  .legal-body h2 {
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 600;
    color: var(--clr-txt);
    margin-bottom: var(--sp-4);
  }

  .legal-body h3 {
    font-size: var(--fz-base);
    font-weight: 500;
    color: var(--clr-txt);
    margin-bottom: var(--sp-3);
    margin-top: var(--sp-5);
  }

  .legal-body p {
    color: var(--clr-txt-muted);
    line-height: 1.85;
    margin-bottom: var(--sp-4);
  }

  .legal-body p:last-child { margin-bottom: 0; }

  .legal-body ul {
    list-style: disc;
    padding-left: var(--sp-6);
    color: var(--clr-txt-muted);
    line-height: 1.85;
    margin-bottom: var(--sp-4);
  }

  .legal-body ul li { margin-bottom: var(--sp-2); }

  .legal-body a { color: var(--clr-pri); text-decoration: underline; }
  .legal-body a:hover { color: var(--clr-pri-light); }

  .ck-table-wrap { overflow-x: auto; margin-block: var(--sp-5); }

  .ck-table {
    min-width: 540px;
    border: 1px solid var(--clr-border-light);
    border-radius: var(--rad-md);
    overflow: hidden;
  }

  .ck-table th, .ck-table td {
    padding: var(--sp-3) var(--sp-4);
    text-align: left;
    font-size: var(--fz-sm);
    border-bottom: 1px solid var(--clr-border-light);
  }

  .ck-table th {
    background: var(--clr-bg-alt);
    font-weight: 500;
    color: var(--clr-txt);
  }

  .ck-table td { color: var(--clr-txt-muted); }
  .ck-table tr:last-child td { border-bottom: none; }
  .ck-table code { font-family: monospace; font-size: 0.85em; background: var(--clr-bg-alt); padding: 2px 5px; border-radius: 3px; }

  
  .ck-trigger {
    position: fixed;
    bottom: var(--sp-5);
    left: var(--sp-5);
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--fz-xs);
    color: var(--clr-txt-muted);
    background: var(--clr-white);
    border: 1px solid var(--clr-border);
    border-radius: var(--rad-full);
    padding: var(--sp-2) var(--sp-4);
    box-shadow: var(--shadow-md);
    cursor: pointer;
    transition: box-shadow var(--trans-base), color var(--trans-base), transform var(--trans-spring);
  }

  .ck-trigger:hover {
    color: var(--clr-pri);
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
  }

  .ck-trigger.pulse {
    animation: ckPulse 2s 1s ease-in-out 3;
  }

  @keyframes ckPulse {
    0%, 100% { box-shadow: var(--shadow-md); }
    50% { box-shadow: 0 0 0 6px rgba(42,107,90,0.15), var(--shadow-md); }
  }

  .ck-modal-bg {
    position: fixed;
    inset: 0;
    background: rgba(17,24,32,0.55);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-5);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--trans-base);
    backdrop-filter: blur(3px);
  }

  .ck-modal-bg.open { opacity: 1; pointer-events: all; }

  .ck-modal {
    background: var(--clr-white);
    border-radius: var(--rad-xl);
    padding: var(--sp-8);
    max-width: 480px;
    width: 100%;
    box-shadow: var(--shadow-xl);
    transform: scale(0.95) translateY(10px);
    transition: transform var(--trans-spring);
  }

  .ck-modal-bg.open .ck-modal { transform: scale(1) translateY(0); }

  .ck-modal-h {
    font-family: var(--ff-head);
    font-size: var(--fz-lg);
    font-weight: 700;
    color: var(--clr-txt);
    margin-bottom: var(--sp-3);
  }

  .ck-modal-p {
    font-size: var(--fz-sm);
    color: var(--clr-txt-muted);
    line-height: 1.7;
    margin-bottom: var(--sp-6);
  }

  .ck-modal-p a { color: var(--clr-pri); text-decoration: underline; }

  .ck-cats { display: flex; flex-direction: column; gap: var(--sp-3); margin-bottom: var(--sp-6); }

  .ck-cat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-4);
    border-radius: var(--rad-md);
    border: 1.5px solid var(--clr-border-light);
    transition: border-color var(--trans-fast);
  }

  .ck-cat:has(input:checked) { border-color: var(--clr-pri); background: rgba(42,107,90,0.03); }

  .ck-cat-info { flex: 1; }
  .ck-cat-name { font-weight: 500; font-size: var(--fz-sm); color: var(--clr-txt); margin-bottom: 2px; }
  .ck-cat-desc { font-size: var(--fz-xs); color: var(--clr-txt-muted); }

  .ck-toggle {
    position: relative;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    margin-left: var(--sp-4);
  }

  .ck-toggle input { opacity: 0; width: 0; height: 0; }

  .ck-slider {
    position: absolute;
    inset: 0;
    background: var(--clr-border);
    border-radius: var(--rad-full);
    cursor: pointer;
    transition: background-color var(--trans-base);
  }

  .ck-slider::before {
    content: '';
    position: absolute;
    width: 18px; height: 18px;
    left: 3px; top: 3px;
    background: white;
    border-radius: 50%;
    transition: transform var(--trans-base);
    box-shadow: var(--shadow-sm);
  }

  .ck-toggle input:checked + .ck-slider { background: var(--clr-pri); }
  .ck-toggle input:checked + .ck-slider::before { transform: translateX(20px); }
  .ck-toggle input:disabled + .ck-slider { opacity: 0.6; cursor: not-allowed; }

  .ck-btns { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
  .ck-btns .btn-pri { flex: 1; justify-content: center; min-width: 120px; }
  .ck-btn-all {
    flex: 1;
    min-width: 120px;
    padding: 0.625rem 1rem;
    border: 1.5px solid var(--clr-pri);
    border-radius: var(--rad-full);
    color: var(--clr-pri);
    font-weight: 500;
    font-size: var(--fz-sm);
    text-align: center;
    cursor: pointer;
    transition: background-color var(--trans-base), color var(--trans-base);
    background: none;
  }
  .ck-btn-all:hover { background: var(--clr-pri); color: var(--clr-white); }

  
  .sec-zona { padding-block: var(--sp-20) var(--sp-24); }

  
  .crd-host { text-align: left; }

  
  .contact-map { margin-top: var(--sp-6); }

  

  @media (min-width: 640px) {
    .frm-row { grid-template-columns: 1fr 1fr; }
    .faq-grid { grid-template-columns: 1fr 1fr; }
    .acc-inner { grid-template-columns: 1fr 1fr; }
  }

  @media (min-width: 768px) {
    .zona-grid { grid-template-columns: 1fr 1fr; }
    .img-feature-grid { grid-template-columns: 1fr 1fr; }
    .cta-band { flex-direction: row; align-items: center; justify-content: space-between; }
    .pres-cta-grid { flex-direction: row; align-items: center; justify-content: space-between; }
    .urgent-inner { flex-direction: row; align-items: center; }
    .contact-grid { grid-template-columns: 1fr 1fr; }
    .ftr-grid { grid-template-columns: 2fr 1fr 1fr 1.5fr; }
    .legal-layout { grid-template-columns: 220px 1fr; }
    .legal-side {
      display: block;
      position: sticky;
      top: calc(var(--nav-h) + var(--sp-8));
      align-self: start;
    }
  }

  @media (min-width: 1024px) {
    .hdr-links { display: flex; }
    .hdr-cta { display: inline-flex; }
    .hdr-burger { display: none; }
    .sidebar-cta { display: flex; }
    .acc-inner { grid-template-columns: 280px 1fr; }
  }

  @media (max-width: 1023px) {
    .sidebar-cta { display: none; }
  }

  @media (max-width: 767px) {
    .legal-layout { grid-template-columns: 1fr; }
    .legal-side { display: none; }
  }
}

@layer utilities {
  .sr-only {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
  }

  .text-center { text-align: center; }
  .mt-auto { margin-top: auto; }
}