/* =========================================================================
   TILITET EARLY CHILDHOOD CARE & DEVELOPMENT CENTRE — Design System
   Display: Outfit | Body: Nunito | UI/Labels: Poppins
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800;1,600&family=Poppins:wght@400;500;600;700&display=swap');

:root{
  /* --- Brand colour tokens (from brief) --- */
  --green:        #1E7A4C;   /* brand green */
  --green-deep:   #12583A;   /* hover / emphasis */
  --green-ink:    #0E3D2B;   /* darkest green, text-on-light */
  --blue-black:   #0E1B22;   /* brand blue-black */
  --blue-black-2: #16303B;   /* lifted panel tone */
  --white:        #FFFFFF;

  --light-green:  #DFEFE1;
  --light-green-2:#EFF7EE;
  --soft-gold:    #E3A73F;
  --soft-gold-ink:#8A5E14;
  --sky-blue:     #5FAAD1;
  --warm-gray:    #756B60;
  --cream:        #FBF6EC;

  /* --- Semantic --- */
  --ink:          #142521;
  --ink-soft:     #445049;
  --line:         #E3DFD3;
  --surface:      #FFFFFF;
  --surface-alt:  var(--cream);
  --focus:        #2E8CFF;

  /* --- Type --- */
  --f-display: 'Outfit', system-ui, sans-serif;
  --f-body: 'Nunito', system-ui, sans-serif;
  --f-ui: 'Poppins', system-ui, sans-serif;

  /* --- Shape / elevation --- */
  --r-sm: 10px;
  --r-md: 18px;
  --r-lg: 28px;
  --r-pill: 999px;
  --shadow-sm: 0 2px 10px rgba(14,27,34,0.06);
  --shadow-md: 0 12px 32px -8px rgba(14,27,34,0.18);
  --shadow-lg: 0 24px 60px -16px rgba(14,27,34,0.28);

  --container: 1220px;
  --gutter: clamp(20px, 5vw, 56px);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important;}
}
body{margin:0;font-family:var(--f-body);color:var(--ink);background:var(--surface);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul,ol{margin:0;padding:0;}
li{list-style:none;}
button{font:inherit;cursor:pointer;}
input,textarea,select{font:inherit;}
h1,h2,h3,h4,h5{font-family:var(--f-display);color:var(--green-ink);margin:0 0 .5em;line-height:1.15;font-weight:700;letter-spacing:-0.01em;}
p{margin:0 0 1em;}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--gutter);}

:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px;}
.skip-link{position:absolute;left:12px;top:-60px;background:var(--blue-black);color:#fff;padding:.7em 1.2em;border-radius:var(--r-sm);z-index:1000;transition:top .2s;}
.skip-link:focus{top:12px;}

/* ---------- Type scale ---------- */
.eyebrow{font-family:var(--f-ui);font-weight:600;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--green);display:inline-flex;align-items:center;gap:.55em;margin-bottom:.9em;}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--soft-gold);border-radius:2px;display:inline-block;}
h1{font-size:clamp(2.3rem,4.4vw,3.6rem);}
h2{font-size:clamp(1.8rem,3.2vw,2.5rem);}
h3{font-size:clamp(1.25rem,2vw,1.5rem);}
.lede{font-size:1.18rem;color:var(--ink-soft);max-width:60ch;}
.section-head{max-width:680px;margin-bottom:2.6rem;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.muted{color:var(--ink-soft);}
.text-gold{color:var(--soft-gold-ink);}

/* ---------- Buttons ---------- */
.btn{font-family:var(--f-ui);font-weight:600;font-size:.96rem;display:inline-flex;align-items:center;justify-content:center;gap:.55em;padding:.95em 1.7em;border-radius:var(--r-pill);border:2px solid transparent;transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;white-space:nowrap;}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--soft-gold);color:var(--green-ink);box-shadow:var(--shadow-sm);}
.btn-primary:hover{background:#EEB558;box-shadow:var(--shadow-md);}
.btn-outline{background:transparent;border-color:currentColor;color:var(--white);}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-outline.on-light{color:var(--green-ink);border-color:var(--green-ink);}
.btn-outline.on-light:hover{background:var(--light-green-2);}
.btn-ghost{background:var(--light-green-2);color:var(--green-ink);}
.btn-ghost:hover{background:var(--light-green);}
.btn-sm{padding:.65em 1.3em;font-size:.86rem;}
.btn-block{width:100%;}

/* ---------- Announcement bar ---------- */
.announce{background:var(--blue-black);color:#fff;font-family:var(--f-ui);font-size:.85rem;}
.announce .container{display:flex;align-items:center;justify-content:center;gap:1em;padding:.6em 3.2rem;text-align:center;position:relative;}
.announce a{color:var(--soft-gold);font-weight:600;border-bottom:1px solid rgba(227,167,63,.5);white-space:nowrap;}
.announce a:hover{border-color:var(--soft-gold);}
.announce-close{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);background:none;border:0;color:#fff;opacity:.7;font-size:1.1rem;line-height:1;padding:4px;}
.announce-close:hover{opacity:1;}
@media (max-width:640px){
  .announce .container{font-size:.76rem;padding:.55em 2.6rem;gap:.4em;flex-wrap:wrap;}
}

/* ---------- Header / Nav ---------- */
.site-header{position:sticky;top:0;z-index:200;background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);transition:box-shadow .25s ease;}
.site-header.scrolled{box-shadow:0 6px 24px rgba(14,27,34,.08);}
.nav-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 28px;max-width:1400px;margin:0 auto;}
.brand{display:flex;align-items:center;gap:.6em;flex:none;}
.brand img{height:42px;width:42px;object-fit:contain;flex:none;}
.brand-word{font-family:var(--f-display);font-weight:800;font-size:1.1rem;color:var(--green-ink);line-height:1.05;white-space:nowrap;}
.brand-word span{display:block;font-family:var(--f-ui);font-weight:500;font-size:.58rem;letter-spacing:.05em;text-transform:uppercase;color:var(--warm-gray);white-space:nowrap;}

.main-nav{display:flex;align-items:center;gap:.1rem;}
.main-nav > ul{display:flex;align-items:center;gap:0;flex-wrap:nowrap;}
.main-nav > ul > li{position:relative;flex:none;}
.nav-link{font-family:var(--f-ui);font-size:.86rem;font-weight:500;color:var(--ink);padding:.65em .6em;border-radius:var(--r-pill);display:flex;align-items:center;gap:.3em;transition:background .18s,color .18s;white-space:nowrap;}
.nav-link:hover, .nav-link:focus-visible, .nav-link.active{background:var(--light-green-2);color:var(--green-ink);}
.nav-link .caret{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px;opacity:.6;transition:transform .18s;}
li.has-dropdown:hover .caret, li.has-dropdown:focus-within .caret{transform:rotate(225deg);margin-top:2px;}

.dropdown{position:absolute;top:100%;left:0;min-width:250px;background:#fff;border-radius:var(--r-md);box-shadow:var(--shadow-lg);border:1px solid var(--line);padding:.6rem;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s ease, transform .18s ease, visibility .18s;}
li.has-dropdown:hover .dropdown, li.has-dropdown:focus-within .dropdown{opacity:1;visibility:visible;transform:translateY(4px);}
.dropdown a{display:block;padding:.7em .9em;border-radius:var(--r-sm);font-size:.9rem;color:var(--ink);font-family:var(--f-ui);}
.dropdown a:hover{background:var(--light-green-2);color:var(--green-ink);}
.dropdown a small{display:block;font-family:var(--f-body);color:var(--ink-soft);font-weight:400;font-size:.8rem;margin-top:.1em;}

.header-cta{display:flex;align-items:center;gap:.6rem;}
.nav-toggle{display:none;background:var(--light-green-2);border:0;width:44px;height:44px;border-radius:var(--r-sm);align-items:center;justify-content:center;flex-direction:column;gap:4px;}
.nav-toggle span{width:20px;height:2px;background:var(--green-ink);border-radius:2px;transition:transform .2s, opacity .2s;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}

/* ---------- Page banner (inner pages) ---------- */
.page-banner{position:relative;background:linear-gradient(160deg,var(--blue-black) 0%,var(--green-ink) 130%);color:#fff;padding:5.2rem 0 4rem;overflow:hidden;isolation:isolate;}
.page-banner::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 15% 20%, rgba(255,255,255,.08), transparent 40%), radial-gradient(circle at 85% 80%, rgba(227,167,63,.14), transparent 45%);z-index:-1;}
.page-banner .breadcrumb{font-family:var(--f-ui);font-size:.82rem;margin-bottom:1rem;opacity:.85;}
.page-banner .breadcrumb a{opacity:.75;}
.page-banner .breadcrumb a:hover{opacity:1;text-decoration:underline;}
.page-banner .breadcrumb .sep{margin:0 .5em;opacity:.5;}
.page-banner h1{color:#fff;margin-bottom:.5rem;}
.page-banner p{color:rgba(255,255,255,.82);max-width:60ch;font-size:1.08rem;}

/* ---------- Wave / leaf divider (signature element) ---------- */
.leaf-divider{display:block;width:100%;height:56px;margin-top:-1px;}
.leaf-divider path{fill:var(--surface);}
.leaf-divider.flip{transform:scaleY(-1);}
.section{padding:5.2rem 0;position:relative;}
.section.tight{padding:3.2rem 0;}
.section.alt{background:var(--surface-alt);}
.section.dark{background:var(--blue-black);color:#fff;}
.section.dark h2,.section.dark h3{color:#fff;}
.section.dark .muted{color:rgba(255,255,255,.68);}
.section.green{background:linear-gradient(155deg,var(--green-ink),var(--green));color:#fff;}
.section.green h2,.section.green h3{color:#fff;}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--cream);overflow:hidden;padding:3.6rem 0 0;}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:3rem;align-items:center;}
.hero-copy .eyebrow{color:var(--green);}
.hero-copy h1{margin-bottom:.7rem;}
.hero-copy h1 em{font-style:normal;color:var(--green);position:relative;}
.hero-copy .lede{margin-bottom:1.8rem;}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2.2rem;}
.trust-row{display:flex;gap:1.6rem;flex-wrap:wrap;padding-top:1.6rem;border-top:1px solid var(--line);}
.trust-item{display:flex;align-items:center;gap:.6em;font-family:var(--f-ui);font-size:.84rem;color:var(--ink-soft);font-weight:500;}
.trust-item .dot{width:8px;height:8px;border-radius:50%;background:var(--soft-gold);flex:none;}

.hero-media{position:relative;}
.hero-media .blob{position:relative;border-radius:38% 62% 63% 37% / 41% 44% 56% 59%;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:1/1.02;}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 35%;}
.hero-badge{position:absolute;left:-1.6rem;bottom:1.6rem;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-md);padding:1.1rem 1.3rem;display:flex;align-items:center;gap:.9rem;max-width:230px;}
.hero-badge .num{font-family:var(--f-display);font-weight:800;font-size:1.7rem;color:var(--green);line-height:1;}
.hero-badge .lbl{font-family:var(--f-ui);font-size:.74rem;color:var(--ink-soft);line-height:1.2;}
.hero-chip{position:absolute;top:1.8rem;right:-1rem;background:var(--soft-gold);color:var(--green-ink);border-radius:var(--r-pill);padding:.6rem 1.1rem;font-family:var(--f-ui);font-weight:600;font-size:.8rem;box-shadow:var(--shadow-md);display:flex;align-items:center;gap:.4em;}

/* ---------- Stats ---------- */
.stats-strip{background:var(--blue-black);color:#fff;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center;padding:3.4rem 0;}
.stat .count{font-family:var(--f-display);font-weight:800;font-size:clamp(2rem,4vw,2.7rem);color:var(--soft-gold);display:flex;align-items:baseline;justify-content:center;gap:.15em;}
.stat .stat-label{font-family:var(--f-ui);font-size:.84rem;color:rgba(255,255,255,.75);margin-top:.4em;}

/* ---------- Cards ---------- */
.grid{display:grid;gap:1.7rem;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

.card{background:#fff;border-radius:var(--r-lg);padding:2rem 1.8rem;box-shadow:var(--shadow-sm);border:1px solid var(--line);transition:transform .28s ease, box-shadow .28s ease;position:relative;}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.card .icon-wrap{width:56px;height:56px;border-radius:var(--r-md);background:var(--light-green-2);display:flex;align-items:center;justify-content:center;margin-bottom:1.2rem;color:var(--green);}
.card h3{margin-bottom:.5rem;font-size:1.15rem;}
.card p{color:var(--ink-soft);font-size:.96rem;margin-bottom:0;}
.card.gold .icon-wrap{background:#FBF0DC;color:var(--soft-gold-ink);}
.card.blue .icon-wrap{background:#EAF4FA;color:var(--sky-blue);}

.value-card{text-align:center;padding:2.2rem 1.5rem;}
.value-card .icon-wrap{margin:0 auto 1.1rem;}

.photo-card{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);background:#fff;transition:transform .3s ease, box-shadow .3s ease;}
.photo-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.photo-card .ph-media{aspect-ratio:4/3;overflow:hidden;}
.photo-card .ph-media img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .5s ease;}
.photo-card:hover .ph-media img{transform:scale(1.06);}
.photo-card .ph-body{padding:1.4rem 1.5rem 1.6rem;}
.photo-card .tag{font-family:var(--f-ui);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--green);}
.photo-card h3{font-size:1.08rem;margin:.4rem 0 .5rem;}
.photo-card p{color:var(--ink-soft);font-size:.92rem;}

/* ---------- Program cards ---------- */
.program-card{background:#fff;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .28s, box-shadow .28s;}
.program-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.program-card .pc-media{aspect-ratio:16/11;overflow:hidden;position:relative;}
.program-card .pc-media img{width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.program-card .pc-age{position:absolute;top:.9rem;left:.9rem;background:rgba(14,27,34,.72);color:#fff;font-family:var(--f-ui);font-size:.72rem;font-weight:600;padding:.4em .8em;border-radius:var(--r-pill);backdrop-filter:blur(4px);}
.program-card .pc-body{padding:1.6rem 1.6rem 1.8rem;flex:1;display:flex;flex-direction:column;}
.program-card h3{margin-bottom:.5rem;}
.program-card p{color:var(--ink-soft);font-size:.95rem;flex:1;}
.program-card .pc-link{margin-top:1rem;font-family:var(--f-ui);font-weight:600;font-size:.88rem;color:var(--green);display:inline-flex;align-items:center;gap:.4em;}
.program-card .pc-link svg{transition:transform .2s;}
.program-card:hover .pc-link svg{transform:translateX(4px);}

/* ---------- Testimonials ---------- */
.testi-track-wrap{position:relative;overflow:hidden;}
.testi-track{display:flex;gap:1.6rem;transition:transform .5s ease;}
.testi-card{flex:0 0 100%;background:#fff;border-radius:var(--r-lg);padding:2.4rem;box-shadow:var(--shadow-sm);border:1px solid var(--line);}
@media(min-width:760px){.testi-card{flex:0 0 calc(50% - .8rem);}}
.testi-card .stars{color:var(--soft-gold);letter-spacing:.15em;margin-bottom:1rem;font-size:1.05rem;}
.testi-card p.quote{font-family:var(--f-body);font-style:italic;font-size:1.05rem;color:var(--ink);margin-bottom:1.4rem;}
.testi-who{display:flex;align-items:center;gap:.8rem;}
.testi-avatar{width:46px;height:46px;border-radius:50%;background:var(--light-green);display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-weight:700;color:var(--green-ink);flex:none;}
.testi-name{font-family:var(--f-ui);font-weight:600;font-size:.92rem;}
.testi-role{font-size:.8rem;color:var(--ink-soft);}
.testi-nav{display:flex;gap:.7rem;justify-content:center;margin-top:2rem;}
.testi-dot{width:9px;height:9px;border-radius:50%;background:var(--line);border:0;padding:0;}
.testi-dot.active{background:var(--green);width:24px;border-radius:6px;transition:width .25s;}

/* ---------- Gallery ---------- */
.filter-row{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2.4rem;}
.filter-btn{font-family:var(--f-ui);font-size:.85rem;font-weight:500;padding:.6em 1.3em;border-radius:var(--r-pill);background:var(--light-green-2);color:var(--green-ink);border:1px solid transparent;}
.filter-btn.active,.filter-btn:hover{background:var(--green);color:#fff;}
.masonry{columns:3 220px;column-gap:1.2rem;}
.masonry .m-item{break-inside:avoid;margin-bottom:1.2rem;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm);position:relative;cursor:zoom-in;border:1px solid var(--line);}
.masonry .m-item img{width:100%;height:auto;display:block;transition:transform .4s ease;}
.masonry .m-item:hover img{transform:scale(1.05);}
.masonry .m-item .m-cap{position:absolute;inset:auto 0 0 0;background:linear-gradient(0deg,rgba(14,27,34,.82),transparent);color:#fff;font-family:var(--f-ui);font-size:.78rem;padding:1.6rem .9rem .7rem;opacity:0;transition:opacity .25s;}
.masonry .m-item:hover .m-cap{opacity:1;}

.lightbox{position:fixed;inset:0;background:rgba(14,27,34,.92);z-index:1000;display:none;align-items:center;justify-content:center;padding:4vh 4vw;}
.lightbox.open{display:flex;}
.lightbox img{width:auto;height:auto;max-width:100%;max-height:88vh;object-fit:contain;border-radius:var(--r-md);box-shadow:var(--shadow-lg);}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;background:rgba(255,255,255,.12);color:#fff;border:0;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;}
.lightbox-close{top:2vh;right:2vw;}
.lightbox-prev{left:2vw;top:50%;transform:translateY(-50%);}
.lightbox-next{right:2vw;top:50%;transform:translateY(-50%);}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:rgba(255,255,255,.24);}

/* ---------- Accordion (FAQ) ---------- */
.accordion{border-top:1px solid var(--line);}
.acc-item{border-bottom:1px solid var(--line);}
.acc-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;text-align:left;background:none;border:0;padding:1.5rem .2rem;font-family:var(--f-display);font-weight:600;font-size:1.04rem;color:var(--green-ink);}
.acc-trigger .plus{flex:none;width:26px;height:26px;border-radius:50%;background:var(--light-green-2);position:relative;transition:background .2s,transform .3s;}
.acc-trigger .plus::before,.acc-trigger .plus::after{content:"";position:absolute;background:var(--green);border-radius:2px;}
.acc-trigger .plus::before{left:7px;right:7px;top:12px;height:2px;}
.acc-trigger .plus::after{top:7px;bottom:7px;left:12px;width:2px;transition:opacity .2s;}
.acc-item.open .acc-trigger .plus{transform:rotate(180deg);background:var(--green);}
.acc-item.open .acc-trigger .plus::before,.acc-item.open .acc-trigger .plus::after{background:#fff;}
.acc-item.open .acc-trigger .plus::after{opacity:0;}
.acc-panel{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.acc-panel-inner{padding:0 .2rem 1.6rem;color:var(--ink-soft);max-width:70ch;}

/* ---------- Tables ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--r-md);box-shadow:var(--shadow-sm);border:1px solid var(--line);}
table{width:100%;border-collapse:collapse;background:#fff;min-width:520px;}
th,td{padding:1rem 1.3rem;text-align:left;border-bottom:1px solid var(--line);font-size:.95rem;}
thead th{font-family:var(--f-ui);font-weight:600;font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:var(--green-ink);}
tbody tr:last-child td{border-bottom:0;}
tbody tr:nth-child(even){background:var(--surface-alt);}
td.amount{font-family:var(--f-ui);font-weight:600;color:var(--green-ink);}

/* ---------- Steps ---------- */
.steps{counter-reset:step;display:grid;gap:1.6rem;}
.step{display:flex;gap:1.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.8rem;box-shadow:var(--shadow-sm);}
.step-num{counter-increment:step;flex:none;width:52px;height:52px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-weight:800;font-size:1.2rem;}
.step-num::before{content:counter(step);}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;}
.field{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1.1rem;}
.field.full{grid-column:1/-1;}
.field label{font-family:var(--f-ui);font-size:.85rem;font-weight:600;color:var(--green-ink);}
.field .req{color:#C24545;}
.field input,.field select,.field textarea{border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85em 1em;font-family:var(--f-body);font-size:.98rem;background:#fff;color:var(--ink);transition:border-color .18s, box-shadow .18s;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px var(--light-green);outline:none;}
.field textarea{resize:vertical;min-height:120px;}
.field .hint{font-size:.78rem;color:var(--ink-soft);}
.field .err{font-size:.8rem;color:#C24545;display:none;}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#C24545;}
.field.invalid .err{display:block;}
.checkbox-row{display:flex;align-items:flex-start;gap:.6em;font-size:.88rem;color:var(--ink-soft);}
.checkbox-row input{margin-top:.3em;}
.form-card{background:#fff;border-radius:var(--r-lg);padding:2.4rem;box-shadow:var(--shadow-sm);border:1px solid var(--line);}
.form-note{background:var(--light-green-2);border-radius:var(--r-md);padding:1.1rem 1.3rem;font-size:.88rem;color:var(--green-ink);display:flex;gap:.7em;margin-bottom:1.6rem;}
.form-success{display:none;text-align:center;padding:3rem 1rem;}
.form-success .tick{width:64px;height:64px;border-radius:50%;background:var(--light-green);color:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;font-size:1.8rem;}

/* ---------- CTA banner ---------- */
.cta-banner{background:linear-gradient(135deg,var(--green-ink),var(--green) 60%, var(--sky-blue) 150%);border-radius:var(--r-lg);padding:3.4rem;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;position:relative;overflow:hidden;}
.cta-banner::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08);}
.cta-banner h2{color:#fff;margin-bottom:.4rem;}
.cta-banner p{color:rgba(255,255,255,.85);margin-bottom:0;}
.cta-actions{display:flex;gap:1rem;flex-wrap:wrap;}

/* ---------- Footer ---------- */
.site-footer{background:var(--blue-black);color:rgba(255,255,255,.75);padding-top:4.5rem;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.3fr;gap:2.4rem;padding-bottom:3rem;border-bottom:1px solid rgba(255,255,255,.1);}
.footer-brand .brand-word{color:#fff;}
.footer-brand .brand-word span{color:rgba(255,255,255,.55);}
.footer-brand p{margin:1.1rem 0 1.3rem;font-size:.92rem;color:rgba(255,255,255,.62);max-width:32ch;}
.footer-social{display:flex;gap:.7rem;}
.footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;transition:background .2s, transform .2s;}
.footer-social a:hover{background:var(--soft-gold);color:var(--green-ink);transform:translateY(-3px);}
.footer-col h4{font-family:var(--f-ui);color:#fff;font-size:.86rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:1.1rem;}
.footer-col li{margin-bottom:.7rem;}
.footer-col a{font-size:.92rem;color:rgba(255,255,255,.68);transition:color .18s;}
.footer-col a:hover{color:var(--soft-gold);}
.footer-contact li{display:flex;gap:.7em;font-size:.9rem;margin-bottom:.9rem;color:rgba(255,255,255,.68);}
.footer-contact svg{flex:none;margin-top:.15em;color:var(--soft-gold);}
.newsletter-form{display:flex;gap:.5rem;margin-top:.8rem;}
.newsletter-form input{flex:1;min-width:0;border-radius:var(--r-pill);border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);padding:.75em 1.1em;color:#fff;font-size:.88rem;}
.newsletter-form input::placeholder{color:rgba(255,255,255,.45);}
.newsletter-form button{border-radius:var(--r-pill);background:var(--soft-gold);color:var(--green-ink);border:0;padding:.75em 1.1em;flex:none;}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:1.6rem 0;font-size:.82rem;color:rgba(255,255,255,.5);}
.footer-bottom-links{display:flex;gap:1.4rem;flex-wrap:wrap;}
.footer-bottom-links a:hover{color:var(--soft-gold);}

/* ---------- Floating helpers ---------- */
.float-stack{position:fixed;right:1.4rem;bottom:1.4rem;display:flex;flex-direction:column;gap:.7rem;z-index:150;}
.fab{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);border:0;transition:transform .2s;}
.fab:hover{transform:translateY(-3px) scale(1.04);}
.fab-whatsapp{background:#25D366;color:#fff;font-size:1.4rem;}
.fab-top{background:#fff;color:var(--green-ink);border:1px solid var(--line);opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .25s, transform .25s;}
.fab-top.show{opacity:1;pointer-events:auto;transform:translateY(0);}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-stagger.in > *{transition-delay:calc(var(--i,0) * 90ms);}

/* ---------- Badges / misc ---------- */
.badge{display:inline-flex;align-items:center;gap:.4em;background:var(--light-green-2);color:var(--green-ink);font-family:var(--f-ui);font-weight:600;font-size:.76rem;padding:.4em .9em;border-radius:var(--r-pill);}
.divider-line{height:1px;background:var(--line);border:0;margin:3rem 0;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;}
.two-col.rev{direction:rtl;}
.two-col.rev > *{direction:ltr;}
.img-frame{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);}
.img-frame img{width:100%;height:auto;max-height:640px;object-fit:cover;object-position:center 30%;}
.check-list li{display:flex;gap:.7em;margin-bottom:.8em;font-size:.98rem;}
.check-list svg{flex:none;color:var(--green);margin-top:.2em;}
.pill-list{display:flex;flex-wrap:wrap;gap:.6rem;}
.pill-list li{background:var(--light-green-2);color:var(--green-ink);font-family:var(--f-ui);font-size:.82rem;font-weight:500;padding:.55em 1.1em;border-radius:var(--r-pill);}

.breadcrumb-inline{font-family:var(--f-ui);font-size:.85rem;color:var(--ink-soft);margin-bottom:1.6rem;}
.breadcrumb-inline a{color:var(--green);}
.pagination{display:flex;gap:.5rem;justify-content:center;margin-top:2.6rem;}
.pagination a,.pagination span{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--f-ui);font-size:.88rem;border:1px solid var(--line);}
.pagination a:hover{background:var(--light-green-2);}
.pagination .current{background:var(--green);color:#fff;border-color:var(--green);}

.tag-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem;}
.tag-row .t{font-family:var(--f-ui);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--green);background:var(--light-green-2);padding:.35em .8em;border-radius:var(--r-pill);}

.share-row{display:flex;align-items:center;gap:.7rem;}
.share-row a{width:38px;height:38px;border-radius:50%;background:var(--light-green-2);color:var(--green-ink);display:flex;align-items:center;justify-content:center;}
.share-row a:hover{background:var(--green);color:#fff;}

.error-page{text-align:center;padding:7rem 0 6rem;}
.error-page .code{font-family:var(--f-display);font-weight:800;font-size:clamp(4.5rem,14vw,8rem);color:var(--light-green);line-height:1;}
.error-page h1{margin-top:-1.2rem;}

.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;}

/* ---------- Responsive ---------- */
@media (max-width:1240px){
  .brand-word span{display:none;}
}
@media (max-width:1080px){
  .footer-grid{grid-template-columns:1fr 1fr 1fr;}
  .footer-brand{grid-column:1/-1;}
}
@media (max-width:940px){
  .main-nav{position:fixed;inset:0 0 0 auto;width:min(88vw,380px);background:#fff;box-shadow:var(--shadow-lg);flex-direction:column;align-items:stretch;padding:1.6rem;transform:translateX(100%);transition:transform .3s ease;overflow-y:auto;z-index:300;}
  .main-nav.open{transform:translateX(0);}
  .main-nav > ul{flex-direction:column;align-items:stretch;gap:.2rem;}
  .nav-link{padding:.9em 1em;}
  .dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;display:none;background:var(--surface-alt);margin:.2rem 0 .4rem;}
  li.has-dropdown.open .dropdown{display:block;}
  li.has-dropdown.open .caret{transform:rotate(225deg);}
  .nav-toggle{display:flex;}
  .nav-scrim{display:none;position:fixed;inset:0;background:rgba(14,27,34,.5);z-index:250;}
  .nav-scrim.show{display:block;}
  .header-cta .btn-primary{display:none;}
  .hero-grid,.two-col{grid-template-columns:1fr;}
  .two-col.rev{direction:ltr;}
  .two-col .hero-media,.two-col img{order:-1;}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3{grid-template-columns:repeat(2,1fr);}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .masonry{columns:2 180px;}
}
@media (max-width:640px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .hero-badge{left:0;bottom:-1.2rem;}
  .cta-banner{padding:2.2rem;flex-direction:column;text-align:center;}
  .footer-grid{grid-template-columns:1fr;}
  .masonry{columns:1;}
  .stats-grid{grid-template-columns:1fr 1fr;}
  section.section{padding:3.4rem 0;}
  .table-wrap table{min-width:480px;}
}