/* ===== Base / tokens ===== */
:root{
  --navy:#002d42;           /* childcare-friendly navy */
  --blue:#007aff;           /* action blue */
  --wa:#25d366;             /* WhatsApp green */
  --ink:#1b2430;
  --muted:#5e6a79;
  --pale:#f7f8fa;           /* card bg */
  --soft:#eef3f6;           /* hero bg */
  --shadow:0 12px 28px rgba(0,0,0,.08);
  --radius:14px;
  --container:1200px;
  --space: clamp(16px, 3.2vw, 28px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:#fff;}
h1,h2,h3,h4,h5,h6 {font-weight: 500;}
img{max-width:100%;display:block}
a{color:#fff;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 16px}
.btn-link{display:inline-block;padding:10px 14px;border-radius:10px;background:var(--navy);color:#fff}
.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:14px 16px;border-radius:12px;border:2px solid var(--blue);
  background:var(--blue);color:#fff;font-weight:800;box-shadow:var(--shadow);
  transition:transform .2s,background .2s,color .2s
}
.btn-primary:hover{background:#fff;color:var(--blue);transform:translateY(-1px)}
.btn-wa{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 14px;border-radius:12px;background:var(--wa);color:#fff;font-weight:800
}
.arrow{display:inline-block;transition:transform .25s}
.btn-primary:hover .arrow{transform:translateX(4px)}

/* ===== Topbar ===== */
.topbar{background:var(--navy);color:#fff;font-size:.95rem}
.topbar__wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0}
.topbar__left a{color:#fff;font-weight:700}
.topbar__left .dot{opacity:.6;margin:0 8px}
.ico{width:18px;height:18px;display:inline-block;vertical-align:-4px;margin-right:6px;background-size:18px 18px;background-repeat:no-repeat}
.i-call{background-image:url('../img/icons/phone.svg')}
.i-mail{background-image:url('../img/icons/mail.svg')}
.soc0{width:28px;height:28px;border-radius:50%;display:inline-block;background:#fff1;backdrop-filter:blur(2px)}
.fb0{background-image:url('../img/icons/fb.svg');background-repeat:no-repeat;background-position:center}
.ig0{background-image:url('../img/icons/ig.svg');background-repeat:no-repeat;background-position:center}
.wa0{background-image:url('../img/icons/wa.svg');background-repeat:no-repeat;background-position:center}

/* ===== Header / nav ===== */
.header{position:sticky;top:0;z-index:40;background:#001543;border-bottom:1px solid #e9edf4;    border-top: 1px solid #e9edf4;}
.header__row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;color:var(--navy);font-weight:900;letter-spacing:.2px}
.brand img{height:80px}
.brand-dot{color:var(--blue)}
.nav__list{display:flex;align-items:center;gap:18px;list-style:none;margin:0;padding:0}
.nav__list a{padding:10px 8px;border-radius:10px}
.nav__list .cta a{background:var(--navy);color:#fff}
.has-dd{position:relative}
.dd-toggle{background:none;border:0;padding:10px 8px;border-radius:10px;font-weight:800;color:#fff;cursor:pointer}
.dd-toggle:hover{background:#f3f6fb}
.chev{margin-left:6px;font-size:.9em;opacity:.8}
.dd-menu{
  position:absolute;top:100%;left:0;margin-top:8px;min-width:200px;background:#fff;border:1px solid #e9edf4;
  border-radius:12px;box-shadow:var(--shadow);list-style:none;padding:8px;display:none;z-index:30
}
.dd-menu a{display:block;padding:10px 12px;border-radius:8px}
.dd-menu a:hover{background:#f5f8ff}
.has-dd:hover .dd-menu{display:block}

/* Mobile nav */
.nav__toggle{display:none;flex-direction:column;gap:5px;width:40px;height:40px;border:0;background:#fff;border:1px solid #e9edf4;border-radius:10px}
.nav__toggle span{height:2px;background:var(--ink);display:block;margin:0 10px}
.mnav{display:none;background:#fff;border-bottom:1px solid #e9edf4}
.mnav ul{list-style:none;margin:0;padding:10px}
.mnav a{display:block;padding:12px;border-radius:10px}
.mdd{margin-top:4px}
.mdd-toggle{width:100%;text-align:left;background:#fff;border:0;padding:12px;border-radius:10px;font-weight:800}
.mdd-toggle::after{content:"▾";float:right;opacity:.7}
.mdd-menu{display:none;padding-left:8px}
.mdd.open .mdd-menu{display:block}

/* ===== Hero ===== */
.hero{background:var(--soft);padding:var(--space) 0}
.hero__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:center}
.hero__media img{width:100%;height:100%;object-fit:cover;border-radius:18px;box-shadow:var(--shadow)}
.hero__card{
  background:#fff;border:1px solid #e9edf4;border-radius:16px;box-shadow:var(--shadow);
  padding:18px
}
.hero__card h1{margin:0 0 8px;color:var(--navy);font-size:clamp(1.3rem,4vw,1.8rem)}
.hero__points{list-style:disc;margin:6px 0 12px 18px;color:var(--muted)}
.trial__form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.trial__form label{display:block}
.trial__form input, .trial__form select{
  width:100%;padding:12px 12px;border:1px solid #dfe5f1;border-radius:12px;background:#fff;color:var(--ink)
}
.trial__form .select{position:relative}
.trial__form .btn-primary{grid-column:1/-1}
.btn-wa{grid-column:1/-1}
.wa-ico{width:18px;height:18px;display:inline-block;background:url('../img/icons/wa.svg') center/18px 18px no-repeat}

/* ===== Responsive ===== */
@media (max-width: 1024px){
  .nav{display:none}
  .nav__toggle{display:flex}
  .hero__grid{grid-template-columns:1fr}
}
@media (max-width: 600px){
  .trial__form{grid-template-columns:1fr}
}
/* ===== About Section ===== */
.about{
  background:#fff;
  padding:80px 20px;
}
.about__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:40px;
}
.about__tag{
  font-family:'Kalam',cursive;
  color:#ff6b3d; /* warm orange accent */
  font-weight:700;
  letter-spacing:1px;
  font-size:1.1rem;
  display:block;
  margin-bottom:6px;
}
.about__text h2{
  font-family:'Fredoka One',cursive;
  color:#002d42;
  font-size:clamp(1.6rem,4vw,2.3rem);
  margin:0 0 14px;
}
.about__text p{
  font-family:'Kalam',cursive;
  color:#444;
  line-height:1.8;
  margin:0 0 14px;
}

/* features */
.about__features{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px 24px;
  margin:16px 0 24px;
}
.feat{
  display:flex;
  align-items:center;
  gap:10px;
  transition:transform .25s, background .25s;
}
.feat:hover{ transform:translateY(-3px); }
.num{
  width:28px;height:28px;
  border-radius:50%;
  background:#ff6b3d;
  color:#fff;
  font-weight:700;
  display:flex;align-items:center;justify-content:center;
  font-size:.95rem;
  transition:background .25s, transform .25s;
}
.feat:hover .num{ background:#007aff; transform:rotate(10deg); }
.label{
  font-family:'Fredoka One',cursive;
  color:#002d42;
  font-size:.95rem;
}

/* Button */
.btn-orange{
  display:inline-block;
  background:#ff6b3d;
  color:#fff;
  font-family:'Fredoka One',cursive;
  padding:12px 24px;
  border-radius:10px;
  box-shadow:0 8px 20px rgba(0,0,0,.1);
  transition:transform .25s, background .25s;
}
.btn-orange:hover{ background:#007aff; transform:translateY(-3px); }

/* right image blob */
.about__img{ position:relative; }
.img-blob{
  position:relative;
  border-radius:50%;
  overflow:hidden;
  background:#d9e9ff;
  padding:12px;
  max-width:420px;
  margin:auto;
  box-shadow:0 14px 40px rgba(0,0,0,.08);
}
.img-blob img{
  border-radius:50%;
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
  transition:transform .6s ease;
}
.img-blob:hover img{ transform:scale(1.05); }

/* ===== Animations (scroll fade) ===== */
[data-animate]{opacity:0;transform:translateY(30px);transition:all .8s ease var(--i,0)*0.1s;}
[data-animate].show{opacity:1;transform:none;}

@keyframes fade-left{from{opacity:0;transform:translateX(-40px);}to{opacity:1;transform:none;}}
@keyframes fade-right{from{opacity:0;transform:translateX(40px);}to{opacity:1;transform:none;}}
@keyframes fade-up{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:none;}}

/* responsive */
@media(max-width:900px){
  .about__grid{grid-template-columns:1fr;gap:24px;}
  .img-blob{max-width:320px;}
}
/* ===== Facilities ===== */
.facilities{ background:#fff; padding:80px 20px; text-align:center; position:relative; }
.facilities__tag{
  display:inline-block; margin-bottom:6px;
  font-family:'Kalam',cursive; color:#ff6b3d; font-weight:700; letter-spacing:.5px;
}
.facilities__title{
  font-family:'Fredoka One',cursive; color:#002d42;
  font-size:clamp(1.6rem,4.2vw,2.4rem); margin:0 0 18px;
}

.facilities__grid{
  display:grid; grid-template-columns:1fr auto 1fr; gap:26px; align-items:center;
}

.facilities__list{ list-style:none; margin:0; padding:0; display:grid; gap:18px; text-align:left; }
.facility{
  display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start;
  background:#fff; border:1px solid #e9edf4; border-radius:14px; padding:14px;
  box-shadow:0 8px 18px rgba(0,0,0,.05);
  transition:transform .25s ease, box-shadow .25s ease;
}
.facility:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,.10); }

.bubble{
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center; font-weight:900; color:#002d42;
  border:3px solid #fff; box-shadow:0 0 0 2px rgba(10,26,61,.08) inset;
  transition:transform .25s ease;
}
.facility:hover .bubble{ transform:rotate(-8deg) scale(1.04); }

/* Pastel number backgrounds using brand-friendly hues */
.b1{ background:#ffe1d5; }
.b2{ background:#ffe9e0; }
.b3{ background:#dff7e9; }
.b4{ background:#f9e0f0; }
.b5{ background:#fff1cf; }
.b6{ background:#e9e2ff; }

.facility__txt h3{
  margin:2px 0 4px; font-family:'Fredoka One',cursive; color:#002d42; font-size:1.05rem;
}
.facility__txt p{ margin:0; color:#444; font-family:'Kalam',cursive; line-height:1.7; }

.facilities__art img{
  width:min(420px, 40vw); height:auto; display:block; margin:auto;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.10));
  border-radius:24px; /* if your art has a background you can remove */
  animation:floatY 6s ease-in-out infinite;
}
@keyframes floatY{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }

/* Scroll-in animations (uses same system added earlier) */
[data-animate]{opacity:0; transform:translateY(30px); transition:all .8s ease;}
[data-animate].show{opacity:1; transform:none;}
/* You can keep your previous [data-animate] rules; these are safe duplicates. */

/* Responsive */
@media (max-width: 1000px){
  .facilities__grid{ grid-template-columns:1fr; gap:20px; }
  .facilities__art img{ width:min(520px, 90vw); }
  .facilities__list{ gap:14px; }
}
/* ===== Activities ===== */
.activities{
  position:relative;
  background:#fbfcfe; /* very light cream/blue */
  padding:80px 20px;
  overflow:hidden;
}
.activities::before{
  /* faint paper/paint texture (optional) */
  content:""; position:absolute; inset:0;
  background:url('../img/paper-texture.png') repeat;
  opacity:.15; pointer-events:none;
}
.act__wrap{ max-width:1200px; margin:0 auto; }
.act__head{ text-align:center; margin-bottom:24px; }
.act__tag{ font-family:'Kalam',cursive; color:#ff6b3d; font-weight:700; letter-spacing:.6px; }
.act__head h2{
  font-family:'Fredoka One',cursive; color:#002d42;
  font-size:clamp(1.6rem,4vw,2.3rem); margin:6px 0 0;
}

/* grid */
.act__grid{
  display:grid; gap:28px;
  grid-template-columns:repeat(3,1fr);
}
@media (max-width: 1024px){
  .act__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 640px){
  .activities{ padding:60px 16px; }
  .act__grid{ grid-template-columns:1fr; gap:18px; }
}

/* card */
.act{
  display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:flex-start;
  background:#fff; border:1px solid #e9edf4; border-radius:14px; padding:16px;
  box-shadow:0 10px 22px rgba(0,0,0,.05);
  transition:transform .25s, box-shadow .25s;
}
.act:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,.09); }

.act__badge{
  width:64px;height:64px;border-radius:50%; display:grid; place-items:center;
  font-family:'Fredoka One',cursive; font-weight:900; color:#002d42;
  background:#ffe3d8; outline:4px solid rgba(0,0,0,.06);
  box-shadow:0 6px 14px rgba(0,0,0,.06); transition:transform .25s, filter .25s;
}
.act:hover .act__badge{ transform:rotate(-6deg) scale(1.04); }

/* badge colour accents */
.a1{ background:#ffd1c2; }
.a2{ background:#ffe0cf; }
.a3{ background:#ccf7dc; }
.a4{ background:#ffd6e5; }
.a5{ background:#ffe9b8; }
.a6{ background:#e7dbff; }

.act__content h3{
  margin:4px 0 4px;
  font-family:'Fredoka One',cursive; color:#002d42; font-size:1.1rem;
}
.act__content p{
  margin:0 0 8px; font-family:'Kalam',cursive; color:#444; line-height:1.7;
}
.act__link{
  display:inline-block; font-family:'Kalam',cursive; font-weight:700;
  color:#ff6b3d; position:relative; padding-right:18px;
}
.act__link::after{
  content:"→"; position:absolute; right:0; top:0; transition:transform .25s;
}
.act__link:hover::after{ transform:translateX(4px); }

/* animate in (reuses your scroll-reveal system) */
.activities [data-animate]{opacity:0; transform:translateY(30px); transition:all .7s ease calc(var(--i,1)*.05s);}
.activities [data-animate].show{opacity:1; transform:none;}
/* ===== Gallery ===== */
.gallery{ background:#fff; padding:80px 20px; }
.gal__head{ text-align:center; margin-bottom:24px; }
.gal__tag{ font-family:'Kalam',cursive; color:#ff6b3d; font-weight:700; letter-spacing:.6px; }
.gallery h2{ font-family:'Fredoka One',cursive; color:#002d42; font-size:clamp(1.6rem,4vw,2.3rem); margin:6px 0 0; }

.gal__grid{
  display:grid; gap:18px;
  grid-template-columns:repeat(3,1fr);
}
@media (max-width: 1024px){ .gal__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width: 640px){ .gallery{ padding:60px 16px; } .gal__grid{ grid-template-columns:1fr; } }

.gal__item{
  display:block; border-radius:16px; overflow:hidden; position:relative; box-shadow:0 12px 28px rgba(0,0,0,.08);
  background:#eef3f6;
}
.gal__item img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.02); transition:transform .45s ease, filter .45s ease; }
.gal__item::after{
  content:""; position:absolute; inset:0; background:linear-gradient( to bottom, rgba(0,0,0,.0), rgba(0,0,0,.12) );
  opacity:0; transition:opacity .3s ease;
}
.gal__item:hover img{ transform:scale(1.06); filter:contrast(1.02) saturate(1.05); }
.gal__item:hover::after{ opacity:1; }

/* Lightbox */
.lightbox{
  position:fixed; inset:0; background:rgba(10,26,61,.75); display:none; place-items:center; z-index:1000;
  padding:20px;
}
.lightbox.open{ display:grid; }
.lb__img{ max-width:min(96vw,1200px); max-height:86vh; border-radius:14px; box-shadow:0 20px 50px rgba(0,0,0,.4); }
.lb__close{
  position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%; border:0;
  background:#fff; color:#002d42; font-weight:800; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.2);
}
.lb__nav{
  position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; border:0;
  background:#fff; color:#002d42; font-size:24px; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.2);
}
.lb__prev{ left:14px; } .lb__next{ right:14px; }
.lb__nav:focus, .lb__close:focus{ outline:3px solid rgba(0,122,255,.6); }

/* animate in using your reveal system */
.gallery [data-animate]{opacity:0; transform:translateY(30px); transition:all .7s ease calc(var(--i,1)*.05s);}
.gallery [data-animate].show{opacity:1; transform:none;}
/* ===== Team ===== */
.team{ background:#fff; padding:80px 20px; }
.team__wrap{ max-width:1200px; margin:0 auto; text-align:center; }
.team__tag{ font-family:'Kalam',cursive; color:#ff6b3d; font-weight:700; letter-spacing:.6px; }
.team__head h2{
  font-family:'Fredoka One',cursive; color:#002d42;
  font-size:clamp(1.6rem,4vw,2.3rem); margin:6px 0 12px;
}
.team__grid{
  display:grid; gap:28px; margin-top:8px;
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:1024px){ .team__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .team{ padding:60px 16px; } .team__grid{ grid-template-columns:1fr; } }

.tcard{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  transition:transform .25s ease, filter .25s ease;
}
.tcard:hover{ transform:translateY(-6px); }

.tcard__avatar{
  position:relative; width:min(360px, 100%); aspect-ratio: 1.35/1; /* landscape-ish blob */
  display:grid; place-items:center;
}
.tcard__avatar img{
  width:100%; height:100%; object-fit:cover;
  border-radius:24px; /* fallback if clip-path unsupported */
  clip-path:url(#blobClip);
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.12));
  transition:transform .6s ease, filter .3s ease;
}
.tcard:hover img{ transform:scale(1.03); filter:drop-shadow(0 22px 38px rgba(0,0,0,.16)); }

/* social reveal on hover */
.tcard__social{
  position:absolute; inset:auto 12px 12px auto; display:flex; gap:8px;
  opacity:0; transform:translateY(6px); transition:opacity .25s ease, transform .25s ease;
}
.tcard:hover .tcard__social{ opacity:1; transform:none; }
.s{
  width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#002d42;color:#fff;
  box-shadow:0 6px 14px rgba(0,0,0,.16);
}
.s.fb{ background:#1877f2; }
.s.ig{ background:#d62976; }
.s.in{ background:#0a66c2; }

/* names/roles */
.tcard h3{
  margin:6px 0 0; font-family:'Fredoka One',cursive; color:#002d42; font-size:1.25rem;
}
.tcard .role{ margin:0; font-family:'Kalam',cursive; color:#ff6b3d; }

/* animate in (uses your reveal engine) */
.team [data-animate]{opacity:0; transform:translateY(30px); transition:all .7s ease calc(var(--i,1)*.06s);}
.team [data-animate].show{opacity:1; transform:none;}
/* ===== Contact ===== */
.contact{background:#fff;padding:80px 20px}
.ct__head{text-align:left;max-width:980px;margin:0 auto 18px}
.ct__tag{font-family:'Kalam',cursive;color:#ff6b3d;font-weight:700;letter-spacing:.6px}
.contact h2{font-family:'Fredoka One',cursive;color:#002d42;font-size:clamp(1.6rem,4vw,2.3rem);margin:6px 0}
.ct__intro{font-family:'Kalam',cursive;color:#444;margin:0}

/* rows */
.ct__row{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:stretch;margin-top:18px}
@media (max-width: 980px){.ct__row{grid-template-columns:1fr}}
.ct__media img{width:100%;height:100%;object-fit:cover;border-radius:16px;box-shadow:0 12px 28px rgba(0,0,0,.08)}

/* info card */
.ct__info{}
.ct__box{
  background:#27a9df; /* friendly teal-blue card */
  color:#fff;border-radius:18px;padding:18px 18px 6px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;
  box-shadow:0 12px 28px rgba(0,0,0,.12)
}
.ct__col h3{margin:0 0 6px;font-family:'Fredoka One',cursive;font-size:1.05rem}
.ct__col p{margin:0;line-height:1.7}
@media (max-width:640px){.ct__box{grid-template-columns:1fr}}

/* socials (reuse icon classes) */
.ct__socials{display:flex;gap:8px;margin-top:4px}
.soc{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#002d42;box-shadow:0 6px 14px rgba(0,0,0,.16)}
.soc.fb{background:#1877f2;color:#fff}.soc.ig{background:#d62976;color:#fff}.soc.tw{background:#1da1f2;color:#fff}.soc.yt{background:#ff0000;color:#fff}

/* map */
.ct__map iframe{width:100%;height:360px;border:0;border-radius:16px;box-shadow:0 12px 28px rgba(0,0,0,.08)}

/* form */
.ct__form{
  background:#f7f8fa;border:1px solid #e9edf4;border-radius:16px;padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px;
  box-shadow:0 12px 28px rgba(0,0,0,.06)
}
.ct__form h3{grid-column:1/-1;margin:0 0 4px;font-family:'Fredoka One',cursive;color:#002d42}
.ct__form label{display:grid;gap:6px}
.ct__form label.full{grid-column:1/-1}
.ct__form input,.ct__form textarea{
  width:100%;padding:12px;border:1px solid #dfe5f1;border-radius:12px;background:#fff;color:#1b2430
}
.btn-send{
  grid-column:1/-1;justify-self:start;background:#ff6b3d;color:#fff;border:2px solid #ff6b3d;border-radius:12px;padding:12px 22px;
  font-weight:800;transition:.25s;box-shadow:0 8px 18px rgba(0,0,0,.12)
}
.btn-send:hover{background:#fff;color:#ff6b3d;transform:translateY(-2px)}

/* reveal animations reuse */
.contact [data-animate]{opacity:0;transform:translateY(30px);transition:all .8s ease calc(var(--i,1)*.05s)}
.contact [data-animate].show{opacity:1;transform:none}
/* ===== Footer ===== */
.site-footer{position:relative;color:#e9eef7;background:#002d42;overflow:hidden}
.sf__bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:brightness(.35) saturate(.9);opacity:.7}
.sf__grid{position:relative;z-index:1;display:grid;gap:28px;grid-template-columns:2fr 1.2fr 1.2fr 1.6fr;padding:48px 16px}
@media(max-width:1100px){.sf__grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.sf__grid{grid-template-columns:1fr;padding:36px 16px}}

.sf__brand{margin:0 0 8px;font-family:'Fredoka One',cursive;font-size:2rem;color:#fff}
.sf__brand .dot{color:#007aff}
.sf__about{margin:0 0 12px;max-width:460px;color:#d0d8ee;font-family:'Kalam',cursive}
.sf__socials{display:flex;gap:10px}
.soc{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#ffffff1a;color:#fff;backdrop-filter:blur(2px);transition:transform .2s,background .2s}
.soc:hover{transform:translateY(-3px);background:#ffffff2e}
.soc.fb{background:#1877f2}.soc.ig{background:#d62976}.soc.pi{background:#e60023}.soc.in{background:#0a66c2}

.sf__title{margin:0 0 10px;font-family:'Fredoka One',cursive;color:#fff;font-size:1.2rem;position:relative}
.sf__title::after{content:"";display:block;width:48px;height:3px;background:#ff6b3d;border-radius:2px;margin-top:6px}
.sf__list,.sf__links{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sf__list li{display:flex;gap:8px;align-items:flex-start}
.ico{width:20px;height:20px;display:inline-block;background-size:20px 20px;background-repeat:no-repeat;filter:invert(1) opacity(.9)}
.i-phone{background-image:url('../img/icons/phone.svg')}
.i-mail{background-image:url('../img/icons/mail.svg')}
.i-pin{background-image:url('../img/icons/pin.svg')}
.sf__links a{color:#d0d8ee}
.sf__links a:hover{color:#fff;text-decoration:underline}

.sf__gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sf__thumb{display:block;overflow:hidden;border-radius:8px;background:#ffffff12}
.sf__thumb img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02);transition:transform .35s ease,filter .35s ease}
.sf__thumb:hover img{transform:scale(1.08);filter:brightness(1.05)}

/* Bottom bar */
.sf__bar{position:relative;z-index:1;background:#001e2c}
.sf__bar__row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;color:#c7d3f0}
.sf__bar__row a{color:#fff}
@media(max-width:640px){.sf__bar__row{flex-direction:column;text-align:center;gap:8px}}

/* Back to top */
.to-top{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#007aff;color:#fff;font-weight:900}
.to-top:hover{background:#ff6b3d}

/* Reveal in footer */
.site-footer [data-animate]{opacity:0;transform:translateY(24px);transition:all .7s ease calc(var(--i,1)*.06s)}
.site-footer [data-animate].show{opacity:1;transform:none}
