/* ===== Tokens ===== */
:root{
  --ink:#544646;
  --ink-2:#3d3232;
  --ink-3:#2c2424;
  --paper:#faf8f7;
  --paper-2:#f1ede9;
  --line:#e4dedb;
  --green:#00bf64;
  --green-dark:#00a656;
  --red:#d1341f;
  --white:#ffffff;
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:10px;
  --shadow:0 24px 48px -24px rgba(44,36,36,.35);
  --shadow-sm:0 8px 20px -12px rgba(44,36,36,.3);
  --container:1180px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

/* ===== Reset ===== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased;}
img,svg{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;list-style:none;}
h1,h2,h3,p{margin:0;}
button{font:inherit;cursor:pointer;}
input,textarea{font:inherit;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
}

.skip-link{position:absolute;left:-999px;top:auto;background:var(--green);color:var(--ink-3);padding:.75rem 1.25rem;border-radius:var(--radius-sm);font-weight:700;z-index:1000;}
.skip-link:focus{left:1rem;top:1rem;}

.wrap{max-width:var(--container);margin:0 auto;padding:0 1.5rem;}
.wrap-narrow{max-width:760px;}

section[id]{scroll-margin-top:86px;}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:none;border-radius:999px;font-weight:700;padding:.85rem 1.6rem;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;cursor:pointer;white-space:nowrap;}
.btn-primary{background:var(--green);color:var(--ink-3);box-shadow:var(--shadow-sm);}
.btn-primary:hover{background:var(--green-dark);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.5);}
.btn-ghost:hover{background:rgba(255,255,255,.1);border-color:var(--white);}
.btn-large{padding:1rem 2rem;font-size:1.05rem;}
.btn-small{padding:.55rem 1.1rem;font-size:.85rem;}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:500;background:var(--ink-3);box-shadow:0 2px 20px rgba(0,0,0,.15);}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:70px;gap:1rem;}
.brand{display:flex;align-items:center;gap:.6rem;}
.brand-mark{width:34px;height:34px;color:var(--green);fill:var(--green);}
.brand-text{color:var(--white);font-weight:800;font-size:1.2rem;display:flex;flex-direction:column;line-height:1.05;}
.brand-text small{color:rgba(255,255,255,.6);font-weight:600;font-size:.6rem;letter-spacing:.08em;}

.nav-links{display:flex;align-items:center;gap:1.6rem;}
.nav-links a{color:rgba(255,255,255,.85);font-weight:600;font-size:.92rem;transition:color .15s ease;}
.nav-links a:hover{color:var(--green);}
.nav-tel{color:var(--green) !important;}

.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:transparent;border:none;padding:0;}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--white);border-radius:2px;}

/* ===== Hero ===== */
.hero{background:linear-gradient(160deg,var(--ink-3) 0%,var(--ink) 65%,var(--ink-2) 100%);padding:5rem 0 4.5rem;position:relative;overflow:hidden;}
.hero-inner{max-width:820px;text-align:left;}
.eyebrow{color:var(--green);font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.8rem;margin-bottom:1.2rem;}
.hero h1{color:var(--white);font-size:clamp(2.4rem,5.5vw,4rem);font-weight:800;line-height:1.08;letter-spacing:-.02em;}
.text-green{color:var(--green);}
.hero-sub{color:rgba(255,255,255,.82);font-size:1.15rem;max-width:640px;margin-top:1.4rem;}

.badge-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.8rem;}
.badge{display:inline-block;padding:.4rem .9rem;border-radius:999px;font-weight:700;font-size:.8rem;letter-spacing:.02em;}
.badge-green{background:rgba(0,191,100,.15);color:var(--green);border:1px solid rgba(0,191,100,.4);}
.badge-red{background:rgba(209,52,31,.15);color:#ff6b52;border:1px solid rgba(209,52,31,.4);}

.hero-ctas{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem;}

/* ===== Trust strip ===== */
.trust-strip{background:var(--paper-2);border-bottom:1px solid var(--line);padding:1.4rem 0;}
.trust-inner{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.2rem;}
.trust-label{font-weight:700;font-size:.8rem;color:var(--ink);opacity:.6;text-transform:uppercase;letter-spacing:.04em;margin-right:.5rem;}
.trust-chips{display:flex;flex-wrap:wrap;gap:.6rem;}
.trust-chips li{background:var(--white);border:1px solid var(--line);padding:.4rem .9rem;border-radius:999px;font-size:.82rem;font-weight:600;color:var(--ink);}

/* ===== Sections ===== */
.section{padding:5rem 0;}
.section-alt{background:var(--paper-2);}
.section-dark{background:var(--ink-3);color:var(--white);}
.section-dark h2, .section-dark h3{color:var(--white);}
.section h2{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;letter-spacing:-.01em;}
.section-lead{margin-top:.8rem;font-size:1.1rem;max-width:640px;opacity:.85;}
.section-lead-dark{color:rgba(255,255,255,.8);}

/* ===== Cards / Grids ===== */
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;margin-top:2.5rem;}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem;margin-top:2.5rem;}

.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:2rem;box-shadow:var(--shadow-sm);}
.card-icon{width:52px;height:52px;color:var(--green);margin-bottom:1.2rem;}
.card h3{font-size:1.15rem;font-weight:800;margin-bottom:.6rem;}
.card p{opacity:.85;font-size:.96rem;}

/* ===== Asset grid ===== */
.asset-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.25rem;margin-top:2.5rem;}
.asset{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);padding:1.4rem 1rem;text-align:center;box-shadow:var(--shadow-sm);}
.asset svg{width:40px;height:40px;margin:0 auto .7rem;color:var(--ink);fill:none;stroke:var(--ink);stroke-width:1.6;}
.asset span{font-weight:700;font-size:.82rem;}

/* ===== Estimate tool ===== */
.estimate-card{background:var(--white);color:var(--ink);border-radius:var(--radius-lg);padding:2.2rem;box-shadow:var(--shadow);max-width:680px;margin-top:2.5rem;}
.estimate-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1.4rem;}
.estimate-card label{display:flex;flex-direction:column;gap:.5rem;font-weight:700;font-size:.82rem;min-width:0;color:var(--ink);opacity:.85;}
.estimate-card input[type="number"]{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:.65rem .8rem;font-weight:700;font-size:1rem;width:100%;min-width:0;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease;}
.estimate-card input[type="number"]:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(0,191,100,.18);}
.estimate-card input[type="number"]::placeholder{color:var(--ink);opacity:.35;}
.checkbox-row{flex-direction:row !important;align-items:center;gap:.7rem !important;margin-bottom:1.6rem;font-weight:600 !important;opacity:1 !important;cursor:pointer;}
.checkbox-row input{width:auto;accent-color:var(--green);}
.estimate-result{margin-top:1.5rem;padding:1.4rem 1.6rem;background:var(--paper-2);border-radius:var(--radius-md);border-left:4px solid var(--green);}
.estimate-tier{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.65;}
.estimate-tier strong{display:block;font-size:1.15rem;font-weight:800;text-transform:none;letter-spacing:normal;opacity:1;margin-top:.15rem;color:var(--ink);}
.estimate-price{color:var(--green-dark);font-weight:800;font-size:1.5rem;margin-top:.3rem;}
.estimate-result p:last-child{margin-top:.5rem;opacity:.8;font-size:.92rem;}

/* ===== Packages ===== */
.pkg-card{position:relative;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:2rem 1.6rem;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;}
.pkg-card h3{font-size:1.25rem;font-weight:800;}
.pkg-sub{color:var(--green-dark);font-weight:700;font-size:.85rem;margin-top:.2rem;text-transform:uppercase;letter-spacing:.03em;}
.pkg-desc{margin-top:1rem;opacity:.85;font-size:.92rem;flex:1;}
.pkg-price{margin-top:1.4rem;display:inline-block;background:var(--green);color:var(--ink-3);font-weight:800;padding:.6rem 1rem;border-radius:var(--radius-sm);text-align:center;}
.pkg-highlight{border-color:var(--green);box-shadow:0 0 0 3px rgba(0,191,100,.15),var(--shadow);}
.pkg-tag{position:absolute;top:-12px;left:1.6rem;background:var(--ink-3);color:var(--green);font-size:.72rem;font-weight:800;padding:.3rem .8rem;border-radius:999px;letter-spacing:.03em;}

/* ===== Steps ===== */
.steps{margin-top:2.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(5,minmax(0,1fr));}
.steps li{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.8rem 1.4rem;box-shadow:var(--shadow-sm);}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--green);color:var(--ink-3);font-weight:800;margin-bottom:1rem;}
.steps h3{font-size:1rem;font-weight:800;margin-bottom:.5rem;}
.steps p{font-size:.88rem;opacity:.85;}

/* ===== Manifesto ===== */
.manifesto-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2.5rem;align-items:start;}
.manifesto h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;}
.manifesto-grid p{margin-top:1rem;color:rgba(255,255,255,.8);}
.fun-fact{background:rgba(0,191,100,.1);border:1px solid rgba(0,191,100,.35);border-radius:var(--radius-lg);padding:1.6rem;}
.fun-fact-label{color:var(--green);font-weight:800;text-transform:uppercase;font-size:.75rem;letter-spacing:.06em;margin-bottom:.6rem;}
.manifesto-quote{margin-top:3rem;font-size:clamp(1.6rem,4vw,2.6rem);font-weight:800;text-align:center;color:var(--green);font-style:italic;}

/* ===== Stats ===== */
.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;margin-top:2.5rem;}
.stat{text-align:center;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.8rem 1rem;box-shadow:var(--shadow-sm);}
.stat-num{display:block;font-size:2.2rem;font-weight:800;color:var(--green-dark);}
.stat span:last-child{font-size:.85rem;opacity:.8;font-weight:600;}

/* ===== FAQ ===== */
.faq-list{margin-top:2rem;display:flex;flex-direction:column;gap:1rem;}
.faq-list details{background:var(--white);border:1px solid var(--line);border-radius:var(--radius-md);padding:1.2rem 1.4rem;box-shadow:var(--shadow-sm);}
.faq-list summary{font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;}
.faq-list summary::-webkit-details-marker{display:none;}
.faq-list summary::after{content:"+";font-size:1.4rem;color:var(--green-dark);font-weight:800;margin-left:1rem;}
.faq-list details[open] summary::after{content:"–";}
.faq-list p{margin-top:.9rem;opacity:.85;font-size:.94rem;}

/* ===== Booking form ===== */
.book-card{background:var(--white);color:var(--ink);border-radius:var(--radius-lg);padding:2.4rem;box-shadow:var(--shadow);margin-top:2.5rem;}
.book-card label{display:flex;flex-direction:column;gap:.4rem;font-weight:700;font-size:.85rem;margin-bottom:1.1rem;min-width:0;}
.book-card input,.book-card textarea,.book-card select{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:.7rem .9rem;font-weight:500;width:100%;min-width:0;background:var(--white);color:var(--ink);}
.book-card textarea{resize:vertical;font-family:inherit;}
.book-card select{cursor:pointer;}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.2rem;min-width:0;}

.device-qty-fieldset{border:none;padding:0;margin:0 0 1.1rem;min-width:0;}
.device-qty-fieldset legend{font-weight:700;font-size:.85rem;padding:0;margin-bottom:.6rem;color:var(--ink);}
.device-qty-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 1.2rem;margin-bottom:.2rem;}
.device-qty-grid label{margin-bottom:1.1rem;}

.notice-callout{margin-top:-.5rem;margin-bottom:1.1rem;padding:.9rem 1.1rem;border-radius:var(--radius-sm);font-size:.88rem;line-height:1.5;background:rgba(209,52,31,.07);border:1px solid rgba(209,52,31,.3);color:var(--ink);}
.notice-callout strong{color:var(--red);}
.hp-field{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.form-alt{margin-top:.4rem;font-size:.88rem;opacity:.75;}
.form-alt a{color:var(--green-dark);font-weight:700;}
.form-status{margin-top:1.2rem;padding:1rem 1.2rem;border-radius:var(--radius-sm);font-weight:600;}
.form-status.success{background:rgba(0,191,100,.12);color:var(--green-dark);border:1px solid rgba(0,191,100,.4);}
.form-status.error{background:rgba(209,52,31,.1);color:var(--red);border:1px solid rgba(209,52,31,.35);}

/* ===== WhatsApp FAB ===== */
.whatsapp-fab{position:fixed;right:1.5rem;bottom:1.5rem;width:58px;height:58px;background:var(--green);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px -8px rgba(0,191,100,.6);z-index:400;transition:transform .15s ease;}
.whatsapp-fab:hover{transform:scale(1.08);}
.whatsapp-fab svg{width:30px;height:30px;color:var(--ink-3);}

/* ===== Footer ===== */
.site-footer{background:var(--ink-3);color:rgba(255,255,255,.8);padding:4rem 0 1.5rem;}
.footer-inner{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem;}
.footer-brand p{margin-top:1rem;font-size:.9rem;opacity:.8;max-width:280px;}
.manifesto-tag{color:var(--green);font-style:italic;font-weight:700;}
.footer-col h4{color:var(--white);font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;}
.footer-col p{margin-bottom:.6rem;font-size:.92rem;}
.footer-col a:hover{color:var(--green);}
.handle{opacity:.6;font-size:.85rem;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:3rem;padding-top:1.5rem;font-size:.82rem;opacity:.7;}

/* ===== Scroll reveal ===== */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
[data-reveal].is-visible{opacity:1;transform:translateY(0);}

/* ===== Responsive ===== */
@media (max-width:1080px){
  .nav-toggle{display:flex;}
  .nav-links{position:absolute;top:70px;left:0;right:0;background:var(--ink-3);flex-direction:column;align-items:flex-start;padding:1.2rem 1.5rem 1.6rem;gap:1rem;display:none;box-shadow:0 12px 24px rgba(0,0,0,.2);max-height:calc(100vh - 70px);overflow-y:auto;}
  .nav-links.is-open{display:flex;}
}

@media (max-width:980px){
  .asset-grid,.steps{grid-template-columns:repeat(3,minmax(0,1fr));}
  .grid-4,.stats-row{grid-template-columns:repeat(2,minmax(0,1fr));}
  .manifesto-grid{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr 1fr;}
}

@media (max-width:760px){
  .asset-grid,.estimate-grid,.form-grid,.device-qty-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .footer-inner{grid-template-columns:1fr;}
  .section{padding:3.5rem 0;}
  .book-card,.estimate-card{padding:1.6rem;}
}

@media (max-width:640px){
  .grid-2,.grid-3,.grid-4,.steps{grid-template-columns:1fr;}
}

@media (max-width:480px){
  .asset-grid,.stats-row{grid-template-columns:repeat(2,minmax(0,1fr));}
  .estimate-grid,.form-grid,.device-qty-grid{grid-template-columns:1fr;}
  .hero{padding:3.5rem 0 3rem;}
  .hero-ctas .btn{width:100%;}
}
