:root{
    --azul: #1B3A4B;
    --verde: #7B9A72;
    --verde-claro: #A8C29A;
    --gris: #5C6F7A;
    --crema: #F7F4EF;
    --crema-2: #EFEAE1;
    --crema-3: #E8E1D4;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--crema);
    color:var(--azul);
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{
    font-family:'Playfair Display',Georgia,serif;
    font-weight:600;
    line-height:1.15;
    letter-spacing:-0.01em;
  }
  a{color:inherit; text-decoration:none;}
  ul{list-style:none;}
  .wrap{max-width:1120px; margin:0 auto; padding:0 32px;}
  .wrap-narrow{max-width:760px; margin:0 auto; padding:0 32px;}
  .eyebrow{
    font-size:12px;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--verde);
    font-weight:700;
  }
  .center{text-align:center; margin-left:auto; margin-right:auto;}
  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--azul);
    color:var(--crema);
    padding:14px 26px;
    border-radius:3px;
    font-weight:600;
    font-size:14.5px;
    letter-spacing:0.02em;
    border:1px solid var(--azul);
    cursor:pointer;
    transition:transform .18s ease, background .18s ease;
  }
  .btn:hover{background:#132a37; transform:translateY(-1px);}
  .btn.ghost{background:transparent; color:var(--azul); border:1px solid var(--azul);}
  .btn.ghost:hover{background:var(--azul); color:var(--crema);}
  .btn.on-dark{background:var(--crema); color:var(--azul); border-color:var(--crema);}
  .btn.on-dark:hover{background:#fff;}

  /* ---------- HEADER ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(247,244,239,0.92);
    backdrop-filter:blur(8px);
    border-bottom:1px solid rgba(27,58,75,0.08);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 32px;
    max-width:1120px; margin:0 auto;
  }
  .logo{display:flex; align-items:center; gap:10px; font-family:'Playfair Display',Georgia,serif; font-weight:600; font-size:19px;}
  .logo img{height:34px; width:auto; display:block;}
  .nav-links{display:flex; gap:34px; font-size:14.5px; font-weight:500;}
  .nav-links a{opacity:.85; transition:opacity .15s;}
  .nav-links a:hover{opacity:1;}
  @media(max-width:760px){ .nav-links{display:none;} }

  /* ---------- BADGE ROW ---------- */
  .badge-row{
    display:flex; gap:26px; flex-wrap:wrap;
    font-size:13px; color:var(--gris); margin-top:26px;
  }
  .badge-row span{display:flex; align-items:center; gap:7px;}
  .badge-row svg{flex-shrink:0;}

  /* ---------- HERO ---------- */
  .hero{padding:80px 0 60px;}
  .hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:52px; align-items:center;}
  @media(max-width:860px){ .hero-grid{grid-template-columns:1fr;} }
  .hero h1{font-size:clamp(32px,4.4vw,52px); margin:14px 0 20px;}
  .hero h1 em{font-style:italic; color:var(--verde);}
  .hero p.lead{font-size:17.5px; color:var(--gris); max-width:480px; margin-bottom:28px;}
  .hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
  .hero-photo{
    border-radius:10px; overflow:hidden;
    box-shadow:0 30px 60px -25px rgba(27,58,75,0.35);
    aspect-ratio:4/3.1;
    background:var(--crema-2);
  }
  .hero-photo-fallback{
    display:flex; align-items:center; justify-content:center;
    background:linear-gradient(160deg, var(--crema-2), #fff);
    padding:24px; position:relative;
  }
  .photo-overlay{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block;}
  .hpf-agenda{width:100%; max-width:340px; background:#fff; border-radius:8px; padding:18px 20px; box-shadow:0 20px 40px -20px rgba(27,58,75,0.3);}
  .hpf-row{display:flex; align-items:center; gap:12px; padding:9px 0; border-top:1px solid rgba(27,58,75,0.08);}
  .hpf-row:first-child{border-top:none;}
  .hpf-time{width:44px; font-size:12px; color:var(--gris); flex-shrink:0;}
  .hpf-bar{flex:1; height:22px; border-radius:3px;}
  .hpf-bar.hpf-filled{background:var(--crema-2);}
  .hpf-bar.hpf-recovered{background:var(--verde-claro);}
  .hero-photo img{width:100%; height:100%; object-fit:cover; display:block;}

  /* ---------- SECTION SCAFFOLD ---------- */
  section{padding:84px 0;}
  .section-head{max-width:640px; margin:0 auto 52px; text-align:center;}
  .section-head h2{font-size:clamp(26px,3vw,36px); margin-top:12px;}
  .section-head p{color:var(--gris); font-size:16px; margin-top:14px;}

  /* ---------- ICON CARD GRID ---------- */
  .card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
  @media(max-width:820px){ .card-grid{grid-template-columns:1fr 1fr;} }
  @media(max-width:560px){ .card-grid{grid-template-columns:1fr;} }
  .icard{
    background:#fff; border:1px solid rgba(27,58,75,0.08);
    border-radius:8px; padding:26px 24px;
  }
  .icard .ic-circle{
    width:42px; height:42px; border-radius:50%;
    background:var(--crema-2);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:16px;
  }
  .icard h3{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; font-weight:600; font-size:16.5px; margin-bottom:8px;}
  .icard p{font-size:14px; color:var(--gris);}

  .problem-band{background:var(--crema-2);}

  .service-band .icard{background:var(--crema);}

  .feature-photo{
    margin-top:44px; border-radius:10px; overflow:hidden; position:relative;
    aspect-ratio:16/6.2;
    background:var(--azul);
  }
  .feature-photo-fallback .fpf-pattern{
    position:absolute; inset:0;
    background:
      radial-gradient(circle at 15% 30%, rgba(168,194,154,0.35) 0%, transparent 45%),
      radial-gradient(circle at 85% 70%, rgba(168,194,154,0.25) 0%, transparent 50%),
      linear-gradient(135deg, var(--azul), #132a37);
  }
  .feature-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  .feature-photo .cap{
    position:absolute; left:24px; bottom:20px;
    background:rgba(27,58,75,0.82); color:var(--crema);
    font-size:13.5px; padding:9px 16px; border-radius:4px;
    display:flex; align-items:center; gap:8px;
  }

  /* ---------- SPLIT ROW (text + checklist) ---------- */
  .split-row{display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:center;}
  @media(max-width:860px){ .split-row{grid-template-columns:1fr;} }
  .city-pills{display:flex; flex-wrap:wrap; gap:8px; margin-top:22px;}
  .city-pills span{
    font-size:12.5px; font-weight:600; color:var(--azul);
    background:#fff; border:1px solid rgba(27,58,75,0.15);
    padding:6px 13px; border-radius:20px;
  }
  .check-card{background:#fff; border:1px solid rgba(27,58,75,0.1); border-radius:10px; padding:8px 26px;}
  .check-row{display:flex; gap:14px; padding:20px 0; border-top:1px solid rgba(27,58,75,0.09); align-items:flex-start;}
  .check-row:first-child{border-top:none;}
  .check-mark{
    width:22px; height:22px; border-radius:50%; background:var(--verde-claro); color:#1c3018;
    display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700;
    flex-shrink:0; margin-top:2px;
  }
  .check-row strong{font-size:15px; font-weight:600; display:block; margin-bottom:3px;}
  .check-row p{font-size:13.5px; color:var(--gris);}

  /* ---------- DEMO MOCKUP ---------- */
  .demo-band{background:var(--azul); position:relative; overflow:hidden; min-height:640px; display:flex; align-items:center;}
  .demo-band .bg-video{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:contain; z-index:0;
  }
  .demo-band .bg-overlay{
    position:absolute; inset:0; background:rgba(27,58,75,0.45); z-index:1;
    display:flex; align-items:center; justify-content:center; cursor:pointer;
  }
  .demo-band .play-btn{
    width:74px; height:74px; border-radius:50%;
    background:var(--crema);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 20px 40px -15px rgba(0,0,0,0.5);
    transition:transform .18s ease;
  }
  .demo-band .bg-overlay:hover .play-btn{transform:scale(1.06);}
  .demo-band .wrap-narrow{position:relative; z-index:2;}
  .demo-band .section-head p{color:rgba(247,244,239,0.72);}
  .demo-band .eyebrow{color:var(--verde-claro);}
  .phone{
    max-width:340px; margin:0 auto;
    background:#12262f; border-radius:26px; padding:14px;
    box-shadow:0 40px 70px -30px rgba(0,0,0,0.6);
  }
  .phone-screen{
    background:linear-gradient(180deg,#22404f,#16303c);
    border-radius:18px; padding:34px 22px; text-align:center;
    color:var(--crema);
  }
  .phone-avatar{
    width:64px; height:64px; border-radius:50%;
    background:var(--verde-claro); color:var(--azul);
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 16px; font-family:'Playfair Display',Georgia,serif; font-weight:600; font-size:22px;
  }
  .phone-screen .caller{font-size:15px; font-weight:600; margin-bottom:2px;}
  .phone-screen .status-line{font-size:12.5px; color:rgba(247,244,239,0.6); margin-bottom:26px;}
  .phone-caption{
    margin-top:20px; font-size:13px; color:rgba(247,244,239,0.65);
    background:rgba(247,244,239,0.06); border-radius:6px; padding:12px 14px;
    text-align:left;
  }
  .call-actions{display:flex; justify-content:center; gap:26px;}
  .call-btn{
    width:48px; height:48px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
  }
  .call-btn.accept{background:var(--verde);}
  .call-btn.decline{background:#8a3b3b;}

  /* ---------- 3 STEPS ---------- */
  .steps-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
  @media(max-width:760px){ .steps-grid{grid-template-columns:1fr;} }
  .step{text-align:center;}
  .step .step-circle{
    width:56px; height:56px; border-radius:50%;
    border:1.5px solid var(--verde);
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 18px;
    font-family:'Playfair Display',Georgia,serif; font-weight:600; color:var(--verde);
  }
  .step h3{font-size:18px; margin-bottom:8px;}
  .step p{font-size:14px; color:var(--gris); max-width:260px; margin:0 auto;}

  /* ---------- PRICING ---------- */
  .pricing-band{background:var(--crema-2);}
  .pricing-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
  @media(max-width:860px){ .pricing-grid{grid-template-columns:1fr; max-width:420px; margin:0 auto;} }
  .plan{background:#fff; border:1px solid rgba(27,58,75,0.12); border-radius:8px; padding:30px 26px; display:flex; flex-direction:column;}
  .plan.featured{border:1.5px solid var(--azul); box-shadow:0 24px 50px -28px rgba(27,58,75,0.35); position:relative; transform:translateY(-6px);}
  .plan .tag{font-size:11px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--verde); margin-bottom:14px;}
  .plan.featured .tag{background:var(--azul); color:var(--crema); display:inline-block; padding:4px 10px; border-radius:3px;}
  .plan h3{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; font-weight:700; font-size:16px; margin-bottom:6px;}
  .plan .price{font-family:'Playfair Display',Georgia,serif; font-size:36px; font-weight:600; margin:6px 0 4px;}
  .plan .price span{font-size:13.5px; font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; font-weight:500; color:var(--gris);}
  .plan .maintenance-note{font-size:12.5px; color:var(--gris); margin-bottom:16px; line-height:1.7;}
  .plan .desc{font-size:13.5px; color:var(--gris); margin-bottom:20px;}
  .plan ul{margin-bottom:24px; flex:1;}
  .plan li{font-size:13.8px; padding:8px 0 8px 22px; position:relative; border-top:1px solid rgba(27,58,75,0.08); color:var(--azul);}
  .plan li:first-child{border-top:none;}
  .plan li::before{content:""; position:absolute; left:0; top:15px; width:8px; height:8px; border-radius:50%; background:var(--verde-claro);}
  .plan .btn{width:100%; justify-content:center;}

  /* ---------- TESTIMONIAL ---------- */
  .testimonial-box{
    max-width:640px; margin:0 auto; text-align:center;
    background:var(--azul); color:var(--crema);
    border-radius:10px; padding:56px 40px;
  }
  .testimonial-box .avatar{width:52px; height:52px; border-radius:50%; background:rgba(247,244,239,0.15); margin:0 auto 18px; display:flex; align-items:center; justify-content:center;}
  .testimonial-box p.msg{font-family:'Playfair Display',Georgia,serif; font-style:italic; font-size:19px; color:rgba(247,244,239,0.92);}
  .testimonial-box p.sub{margin-top:12px; font-size:13.5px; color:rgba(247,244,239,0.6);}

  /* ---------- SEO / LONG COPY ---------- */
  .seo-block h2{font-size:26px; margin-bottom:16px;}
  .seo-block p{color:var(--gris); font-size:15px; margin-bottom:16px;}
  .seo-block h3{font-size:16.5px; margin:26px 0 10px;}
  .seo-block ul{padding-left:0;}
  .seo-block li{font-size:14.5px; color:var(--gris); padding:6px 0 6px 20px; position:relative;}
  .seo-block li::before{content:""; position:absolute; left:0; top:15px; width:6px; height:6px; border-radius:50%; background:var(--verde-claro);}

  /* ---------- FAQ ---------- */
  .faq-item{border-top:1px solid rgba(27,58,75,0.12);}
  .faq-item:last-child{border-bottom:1px solid rgba(27,58,75,0.12);}
  .faq-item summary{
    list-style:none; cursor:pointer;
    display:flex; justify-content:space-between; align-items:center;
    padding:20px 4px; font-weight:600; font-size:15.5px;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary .chev{transition:transform .2s ease; color:var(--verde); flex-shrink:0; margin-left:16px;}
  .faq-item[open] summary .chev{transform:rotate(45deg);}
  .faq-item .faq-body{padding:0 4px 22px; color:var(--gris); font-size:14.5px; max-width:640px;}
  .faq-cta{
    margin-top:28px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
    background:var(--crema-2); border-radius:8px; padding:20px 24px;
  }
  .faq-cta p{font-size:14.5px; color:var(--azul); font-weight:500;}

  /* ---------- CONTACT ---------- */
  .contact-band{background:var(--azul); color:var(--crema);}
  .contact-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:50px;}
  @media(max-width:900px){ .contact-grid{grid-template-columns:1fr;} }
  .contact-band .eyebrow{color:var(--verde-claro);}
  .contact-band h2{font-size:clamp(26px,3vw,34px); margin:14px 0 16px;}
  .contact-band p{color:rgba(247,244,239,0.72); font-size:15.5px;}
  .contact-photo{border-radius:8px; overflow:hidden; margin-top:28px; aspect-ratio:16/10; background:rgba(247,244,239,0.1);}
  .contact-photo-fallback{display:flex; align-items:center; justify-content:center; background:linear-gradient(160deg, rgba(247,244,239,0.08), rgba(247,244,239,0.02)); position:relative;}
  .contact-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  .contact-facts{margin-top:24px; display:flex; flex-direction:column; gap:12px; font-size:14.5px;}
  .contact-facts div{display:flex; gap:10px; align-items:center; color:rgba(247,244,239,0.85);}

  form{background:var(--crema); border-radius:8px; padding:30px; color:var(--azul);}
  .field-row{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px;}
  @media(max-width:520px){ .field-row{grid-template-columns:1fr;} }
  label{display:block; font-size:12.5px; font-weight:600; color:var(--azul); margin-bottom:6px;}
  input, select, textarea{
    width:100%; border:1px solid rgba(27,58,75,0.2); border-radius:4px;
    padding:11px 12px; font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; font-size:14.5px; color:var(--azul); background:#fff;
  }
  input:focus, select:focus, textarea:focus{outline:2px solid var(--verde); outline-offset:1px; border-color:var(--verde);}
  .field{margin-bottom:14px;}
  form .btn{width:100%; justify-content:center; margin-top:6px;}
  .consent-row{display:flex; gap:10px; align-items:flex-start; margin-top:16px;}
  .consent-row input[type="checkbox"]{width:16px; height:16px; margin-top:2px; flex-shrink:0; accent-color:var(--azul);}
  .consent-label{font-size:12.5px; color:var(--gris); font-weight:400; line-height:1.5;}
  .inline-link{color:var(--azul); text-decoration:underline;}
  .inline-link:hover{color:var(--verde);}

  /* ---------- LEGAL PAGES (shown/hidden via JS, feel like separate pages) ---------- */
  .legal-page{display:none; min-height:100vh; padding-bottom:60px;}
  .legal-page-header{
    padding:20px 32px; border-bottom:1px solid rgba(27,58,75,0.08);
  }
  .back-link{font-size:13.5px; font-weight:600; color:var(--azul); display:inline-flex; align-items:center; gap:6px;}
  .back-link:hover{color:var(--verde);}
  .legal-page .seo-block{padding-top:50px;}

  /* ---------- FOOTER ---------- */
  footer{background:#132a37; color:rgba(247,244,239,0.62); padding:44px 0 30px; font-size:13.5px;}
  .footer-grid{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; padding-bottom:24px; border-bottom:1px solid rgba(247,244,239,0.12); margin-bottom:20px;}
  .footer-logo{display:flex; align-items:center; gap:10px; color:var(--crema); font-family:'Playfair Display',Georgia,serif; font-size:17px; font-weight:600;}
  .footer-logo img{height:28px; width:auto;}
  .footer-links{display:flex; gap:26px;}
  .footer-links a:hover{color:var(--crema);}
  .footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}