/* ===========================================================
   Tiny Toes Photography — shared design system
   =========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Sacramento&display=swap');
:root{
  --ivory:#f8f3ec; --cream:#efe7d9; --paper:#fcf9f4;
  --ink:#39332b; --soft:#8c8073; --faint:#b6aa98;
  --gold:#c3a063; --gold-d:#a9873f; --sage:#9aa48b; --blush:#e6cdc0;
  --line:#e4dacb; --shadow:rgba(90,60,40,.12);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ivory);color:var(--ink);font-family:'Jost',sans-serif;font-weight:300;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4,.disp{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.08}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}
.wrap{max-width:1280px;margin:0 auto;padding:0 40px}
.ey{font-weight:400;letter-spacing:.42em;text-transform:uppercase;font-size:.68rem;color:var(--gold-d)}
em{font-style:italic}

/* buttons — signature: gold sweep-up fill, letter-spacing bloom, corner ticks */
/* Signature: Arrow Reveal (style E) — text nudges left, a gold arrow slides in */
.btn{position:relative;display:inline-block;padding:16px 46px;font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;border:1px solid var(--line);font-family:'Jost',sans-serif;background:var(--paper);color:var(--ink);overflow:visible;transition:color .4s ease,border-color .45s ease,background .4s ease,padding .45s cubic-bezier(.2,.7,.2,1)}
.btn::after{content:"\2192";position:absolute;top:50%;right:20px;transform:translateY(-50%) translateX(9px);opacity:0;color:var(--gold-d);font-size:1.05em;letter-spacing:0;transition:opacity .4s ease,transform .45s cubic-bezier(.2,.7,.2,1)}
.btn:hover{border-color:var(--gold);padding-left:39px;padding-right:53px}
.btn:hover::after{opacity:1;transform:translateY(-50%) translateX(0)}
.btn-solid{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-solid::after{color:#e8cf9c}
.btn-solid:hover{border-color:var(--gold)}
.btn-light{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn-light:hover{border-color:var(--gold)}
.btn-out{background:none;border-color:currentColor}
.btn-out::after{color:currentColor}
.btn-out:hover{border-color:var(--gold)}
.btn-out:hover::after{color:var(--gold-d)}
.btn-sm{padding:13px 32px}
.btn-sm::after{right:16px}
.btn-sm:hover{padding-left:25px;padding-right:39px}

/* ---------- HERO CROSSFADE SLIDESHOW ---------- */
.hero-slides{position:absolute;inset:0;z-index:0}
.hero-slides .hs{position:absolute;inset:0;background-size:cover;background-position:center 38%;opacity:0;transform:scale(1.04);transition:opacity 1.8s ease}
.hero-slides .hs.on{opacity:1;animation:heroKB 7.6s ease-out forwards}
@keyframes heroKB{from{transform:scale(1.04)}to{transform:scale(1.13)}}

/* ---------- BLUR-UP IMAGE LOAD ---------- */
img.bup{filter:blur(16px);opacity:0;transition:filter 1s ease,opacity 1s ease}
img.bup.on{filter:blur(0);opacity:1}

/* ---------- FILM-GRAIN TEXTURE ---------- */
.grain{position:fixed;inset:0;z-index:9000;pointer-events:none;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:150px 150px}

/* ---------- PAGE TRANSITION VEIL ---------- */
.pageveil{position:fixed;inset:0;z-index:9500;background:var(--ivory);pointer-events:none;opacity:0;transition:opacity .5s ease}
.pageveil.in{opacity:1;pointer-events:all}

@media(prefers-reduced-motion:reduce){
  .hero-slides .hs.on{animation:none}
  img.bup{transition:opacity .3s ease;filter:none}
  .pageveil{display:none}
}

/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.1s}.rv.d2{transition-delay:.2s}.rv.d3{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- NAV ---------- */
header{position:fixed;inset:0 0 auto 0;z-index:90;padding:24px 0;transition:.45s}
header.solid,header.scrolled{background:rgba(248,243,236,.92);backdrop-filter:blur(12px);padding:14px 0;box-shadow:0 1px 0 var(--line)}
nav{display:flex;align-items:center;justify-content:space-between}
.brand{font-family:'Cormorant Garamond',serif;font-size:1.45rem;letter-spacing:.04em;color:#fff;transition:.45s;line-height:1}
.brand b{font-weight:600}
.brand small{display:block;font-family:'Jost',sans-serif;font-weight:400;font-size:.52rem;letter-spacing:.44em;text-transform:uppercase;margin-top:5px;opacity:.85}
/* logo lockup (replicates the tiny toes watermark) */
.logo{display:inline-flex;flex-direction:column;align-items:center;line-height:1;color:#fff;transition:.45s;position:relative;padding-right:30px}
header.solid .logo,header.scrolled .logo{color:var(--ink)}
.logo .lg-script{font-family:'Sacramento',cursive;font-size:2.35rem;letter-spacing:.01em;line-height:.8}
.logo .lg-sub{font-family:'Jost',sans-serif;font-weight:400;font-size:.56rem;letter-spacing:.46em;text-transform:uppercase;margin-top:3px;padding-left:.46em}
.logo .lg-cam{position:absolute;right:0;top:-2px;width:26px;height:26px}
.logo .lg-cam svg{width:100%;height:100%;display:block}
.logo.lg-lg .lg-script{font-size:3.4rem}
.logo.lg-lg{padding-right:40px}
.logo.lg-lg .lg-cam{width:36px;height:36px;top:0}
.logo.lg-lg .lg-sub{font-size:.72rem}
/* footer logo always light */
.fbrand .logo,.fbrand .logo *{color:#ece3d4}
header.solid .brand,header.scrolled .brand{color:var(--ink)}
.links{display:flex;gap:34px;align-items:center}
.links a.navlink{position:relative;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;opacity:.95}
header.solid .links a.navlink,header.scrolled .links a.navlink{color:var(--ink)}
.links a.navlink::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--gold);transition:.35s}
.links a.navlink:hover::after,.links a.navlink.active::after{width:100%}
.links a.navlink.active{color:var(--gold-d)}
header.solid .links a.navlink.active{color:var(--gold-d)}
.links .btn{padding:11px 26px}
.btn-nav{background:rgba(30,25,18,.34);border:1px solid rgba(255,255,255,.75);color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.btn-nav::after{display:none}
.btn-nav:hover{padding-left:26px;padding-right:26px;background:var(--gold);border-color:var(--gold);color:#fff;text-shadow:none}
header.solid .btn-nav,header.scrolled .btn-nav{background:transparent;border-color:var(--gold-d);color:var(--gold-d);text-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
header.solid .btn-nav:hover,header.scrolled .btn-nav:hover{background:var(--gold);border-color:var(--gold);color:#fff}

/* Hero ghost button over the photo — readable before hover, keeps the arrow */
.btn-ghost-photo{background:rgba(30,25,18,.36);border:1px solid rgba(255,255,255,.8);color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.5);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.btn-ghost-photo::after{color:#f0d9a7}
.btn-ghost-photo:hover{border-color:var(--gold);background:rgba(30,25,18,.52)}

/* Social links row */
.social .sociallinks{display:flex;justify-content:center;gap:40px;flex-wrap:wrap}
.social .sociallinks a{display:inline-flex;flex-direction:column;align-items:center;gap:9px;color:var(--ink);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;transition:color .35s,transform .35s}
.social .sociallinks svg{width:30px;height:30px;color:var(--gold-d);transition:transform .4s cubic-bezier(.2,.7,.2,1),color .35s}
.social .sociallinks a:hover{color:var(--gold-d)}
.social .sociallinks a:hover svg{transform:translateY(-4px) scale(1.08)}
/* mobile toggle */
.navtoggle{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:6px}
.navtoggle span{width:26px;height:2px;background:#fff;transition:.3s}
header.solid .navtoggle span,header.scrolled .navtoggle span{background:var(--ink)}
.mobilemenu{position:fixed;inset:0;z-index:95;background:var(--ivory);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;transform:translateY(-100%);transition:.5s cubic-bezier(.3,.7,.2,1);opacity:0}
.mobilemenu.open{transform:none;opacity:1}
.mobilemenu a{font-family:'Cormorant Garamond',serif;font-size:1.9rem;color:var(--ink)}
.mobilemenu a.active{color:var(--gold-d)}
.mobilemenu .close{position:absolute;top:26px;right:30px;font-size:2rem;color:var(--ink);background:none;border:0;cursor:pointer;line-height:1}

/* ---------- PAGE HERO (interior) ---------- */
.phero{position:relative;min-height:62vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:140px 24px 90px}
.phero .bg{position:absolute;inset:0;transform:scale(1.06)}
.phero::after{content:"";position:absolute;inset:0;background:rgba(35,30,24,.42)}
.phero .c{position:relative;z-index:2;color:#fff}
.phero .c .ey{color:#f1e2c3;display:inline-block;margin-bottom:18px}
.phero .c h1{font-size:clamp(2.8rem,6.5vw,5rem)}
.phero .c h1 em{font-style:italic}
.phero .c p{max-width:540px;margin:18px auto 0;opacity:.95}

/* ---------- SECTION HEAD ---------- */
.shead{text-align:center;margin-bottom:60px}
.shead .ey{display:inline-block;margin-bottom:18px}
.shead h2{font-size:clamp(2.2rem,4.8vw,3.4rem);font-weight:500}
.shead h2 em{font-style:italic;color:var(--gold-d)}
.shead p{color:var(--soft);max-width:560px;margin:16px auto 0}
.sec{padding:120px 0}
.sec-cream{background:var(--cream)}
.sec-paper{background:var(--paper)}

/* ---------- FEATURE SPLIT ---------- */
.feature{display:grid;grid-template-columns:1fr 1fr;align-items:center}
.feature .ph{height:88vh;min-height:600px;overflow:hidden}
.feature .ph img{transition:1.6s cubic-bezier(.2,.7,.2,1)}
.feature:hover .ph img{transform:scale(1.05)}
.feature .tx{padding:90px clamp(36px,6.5vw,110px)}
.feature .tx .ey{display:inline-block;margin-bottom:22px}
.feature .tx h2{font-size:clamp(2.1rem,4.2vw,3.1rem);margin-bottom:22px;font-weight:500}
.feature .tx h2 em{font-style:italic;color:var(--gold-d)}
.feature .tx p{color:var(--soft);margin-bottom:18px}
.feature .tx .meta{margin:26px 0 30px;padding-top:24px;border-top:1px solid var(--line);display:flex;gap:40px}
.feature .tx .meta b{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--ink);display:block;font-weight:500}
.feature .tx .meta span{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.feature.alt .ph{order:2}

/* ---------- SLIDING REEL ---------- */
.reel{overflow:hidden}
.reel .row{display:flex;gap:16px;width:max-content}
.reel .r1{animation:slideL 60s linear infinite}
.reel .r2{animation:slideR 60s linear infinite;margin-top:16px}
.reel:hover .row{animation-play-state:paused}
@keyframes slideL{to{transform:translateX(-50%)}}
@keyframes slideR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.reel .slide{flex:0 0 auto;width:300px;height:380px;overflow:hidden;position:relative;cursor:pointer}
.reel .slide img{transition:1.4s cubic-bezier(.2,.7,.2,1)}
.reel .slide:hover img{transform:scale(1.07)}

/* ---------- CARDS GRID (sessions) ---------- */
.sgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.scard{position:relative;overflow:hidden;aspect-ratio:4/5;cursor:pointer;display:block}
.scard img{transition:1.3s cubic-bezier(.2,.7,.2,1);transform:scale(1.02)}
.scard:hover img{transform:scale(1.1)}
.scard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(35,30,24,0) 40%,rgba(35,30,24,.76));transition:.4s}
.scard:hover::after{background:linear-gradient(180deg,rgba(35,30,24,.1) 20%,rgba(35,30,24,.82))}
.scard .cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:30px 28px;color:#fff;text-align:center}
.scard .cap .n{font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:#eacf9f;display:block;margin-bottom:8px}
.scard .cap h3{font-size:1.85rem;font-weight:500}
.scard .cap .more{display:inline-block;margin-top:12px;font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;opacity:0;transform:translateY(8px);transition:.4s}
.scard:hover .cap .more{opacity:.95;transform:none}

/* ---------- PORTFOLIO FILTER + MASONRY ---------- */
.filterbar{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:50px}
.filterbar button{font-family:'Jost',sans-serif;font-weight:400;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);background:none;border:1px solid var(--line);padding:11px 24px;border-radius:40px;cursor:pointer;transition:.3s}
.filterbar button:hover{color:var(--ink);border-color:var(--gold)}
.filterbar button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.masonry{columns:3;column-gap:16px}
.masonry .m{break-inside:avoid;margin-bottom:16px;overflow:hidden;position:relative;cursor:pointer}
.masonry .m img{transition:1s cubic-bezier(.2,.7,.2,1)}
.masonry .m:hover img{transform:scale(1.06)}
.masonry .m::after{content:"";position:absolute;inset:0;background:rgba(35,30,24,0);transition:.4s}
.masonry .m:hover::after{background:rgba(35,30,24,.12)}
.masonry .m .tag{position:absolute;left:14px;bottom:14px;z-index:2;color:#fff;font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;opacity:0;transform:translateY(6px);transition:.4s}
.masonry .m:hover .tag{opacity:1;transform:none}
.masonry .m.hide{display:none}

/* ---------- LIGHTBOX ---------- */
.lb{position:fixed;inset:0;z-index:120;background:rgba(28,25,22,.94);display:none;align-items:center;justify-content:center;padding:40px}
.lb.open{display:flex}
.lb img{max-width:92vw;max-height:88vh;width:auto;height:auto;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lb .x{position:absolute;top:24px;right:30px;color:#fff;font-size:2.4rem;cursor:pointer;line-height:1;opacity:.8}
.lb .x:hover{opacity:1}
.lb .nav{position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-size:2.6rem;cursor:pointer;opacity:.7;padding:20px;user-select:none}
.lb .nav:hover{opacity:1}
.lb .prev{left:14px}.lb .next{right:14px}

/* ---------- PRICING ---------- */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tier{background:var(--paper);border:1px solid var(--line);padding:46px 36px;transition:.4s;position:relative}
.tier:hover{box-shadow:0 26px 54px var(--shadow);transform:translateY(-4px)}
.tier .ey{display:block;margin-bottom:16px}
.tier h3{font-size:2rem;margin-bottom:6px}
.tier .price{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--gold-d);margin-bottom:24px;font-weight:500}
.tier ul{list-style:none;margin-bottom:30px}
.tier ul li{padding:11px 0;border-bottom:1px solid var(--line);color:var(--soft);font-size:.95rem;display:flex;gap:10px}
.tier ul li::before{content:"✦";color:var(--gold);font-size:.7rem;margin-top:4px}
.tier.feat{background:var(--ink);color:var(--paper)}
.tier.feat .ey{color:var(--gold)}
.tier.feat .price{color:var(--gold)}
.tier.feat ul li{color:#d9cfbf;border-color:#4a4236}
.tier.feat .tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--gold);color:#fff;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;padding:6px 18px;border-radius:30px}

/* ---------- FAQ ---------- */
.faq{max-width:820px;margin:0 auto}
.faq .item{border-bottom:1px solid var(--line)}
.faq .q{width:100%;text-align:left;background:none;border:0;padding:26px 0;font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--ink);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px}
.faq .q .ic{font-family:'Jost',sans-serif;font-size:1.4rem;color:var(--gold-d);transition:.3s;flex:0 0 auto}
.faq .item.open .q .ic{transform:rotate(45deg)}
.faq .a{max-height:0;overflow:hidden;transition:max-height .45s ease}
.faq .a p{color:var(--soft);padding:0 0 26px}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:start}
.form label{display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin:22px 0 8px}
.form input,.form select,.form textarea{width:100%;background:var(--paper);border:1px solid var(--line);padding:14px 16px;font-family:'Jost',sans-serif;font-weight:300;font-size:.98rem;color:var(--ink);transition:.3s}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--gold)}
.form textarea{min-height:130px;resize:vertical}
.form .btn{margin-top:28px;border:0}
.info .block{margin-bottom:34px}
.info h4{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-d);margin-bottom:10px}
.info p{color:var(--soft)}
.info a{color:var(--ink);border-bottom:1px solid var(--gold)}
.mapph{aspect-ratio:16/10;background:linear-gradient(135deg,var(--cream),var(--blush));border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--soft);font-style:italic;font-family:'Cormorant Garamond',serif;font-size:1.3rem;margin-top:14px}

/* ---------- QUOTE ---------- */
.quote{text-align:center;padding:130px 24px}
.quote .stars{color:var(--gold);letter-spacing:4px;margin-bottom:26px}
.quote blockquote{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:clamp(1.8rem,3.8vw,2.7rem);line-height:1.32;max-width:900px;margin:0 auto}
.quote blockquote em{font-style:italic;color:var(--gold-d)}
.quote cite{display:block;margin-top:30px;font-style:normal;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--soft)}

/* ---------- REVIEW CARDS ---------- */
.revgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.revcard{background:var(--paper);border:1px solid var(--line);padding:38px 32px;text-align:left;transition:.4s}
.revcard:hover{box-shadow:0 20px 46px var(--shadow);transform:translateY(-4px)}
.revcard .s{color:var(--gold);letter-spacing:3px;margin-bottom:16px;font-size:.92rem}
.revcard blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem;line-height:1.42;color:var(--ink);margin-bottom:20px}
.revcard .who{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--soft)}
.revcard .who b{color:var(--gold-d);font-weight:400}
.revcard .who .gbadge{display:inline;margin:0 0 0 7px;font-size:.66rem;letter-spacing:.16em;color:var(--gold-d)}
.revcard .who .gbadge::before{content:"· ";color:var(--soft)}
.gbadge{display:inline-flex;align-items:center;gap:10px;margin-top:40px;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--soft)}
.gbadge b{font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--gold-d);letter-spacing:0}
@media(max-width:860px){.revgrid{grid-template-columns:1fr}}

/* ---------- CTA BAND ---------- */
.band{position:relative;height:66vh;min-height:460px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.band .bg{position:absolute;inset:0;transform:scale(1.05);transition:8s ease}
.band:hover .bg{transform:scale(1)}
.band::after{content:"";position:absolute;inset:0;background:rgba(35,30,24,.46)}
.band .c{position:relative;z-index:2;color:#fff;padding:0 24px}
.band .c .ey{color:#f1e2c3;display:inline-block;margin-bottom:20px}
.band .c h2{font-size:clamp(2.4rem,5.4vw,4rem);margin-bottom:18px;font-weight:500}
.band .c h2 em{font-style:italic}
.band .c p{opacity:.94;margin-bottom:32px;max-width:480px;margin-left:auto;margin-right:auto}

/* ---------- FOOTER ---------- */
footer{background:#2d2821;color:#e7ddce;padding:88px 0 40px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:40px;align-items:start}
.fbrand{font-family:'Cormorant Garamond',serif;font-size:2rem;line-height:1.1}
.fbrand b{font-weight:600}
.fbrand small{display:block;font-family:'Jost',sans-serif;font-weight:400;font-size:.56rem;letter-spacing:.4em;text-transform:uppercase;margin-top:8px;color:#b3a894}
footer p.tag{color:#b3a894;margin-top:18px;font-size:.92rem;max-width:280px}
.fcol h4{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.fcol a{display:block;color:#cdc2b1;font-size:.92rem;margin-bottom:11px;transition:.3s}
.fcol a:hover{color:#fff;padding-left:4px}
.fcol p{color:#cdc2b1;font-size:.92rem;line-height:1.9}
.fbot{margin-top:56px;padding-top:26px;border-top:1px solid #423b31;display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#897d6b}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1000px){
  .fgrid{grid-template-columns:1fr 1fr}
  .masonry{columns:2}
  .contact-grid{grid-template-columns:1fr;gap:50px}
  .iggrid{grid-template-columns:repeat(4,1fr)!important}
}
@media(max-width:860px){
  .wrap{padding:0 24px}
  .links a.navlink,.links .btn-nav{display:none}
  .navtoggle{display:flex}
  .sgrid,.tiers{grid-template-columns:repeat(2,1fr)}
  .feature{grid-template-columns:1fr}
  .feature .ph{height:60vh;order:-1!important}
  .feature.alt .ph{order:-1}
  .feature .tx{padding:54px 24px}
  .fgrid{grid-template-columns:1fr 1fr;gap:40px}
  .fbot{justify-content:center;text-align:center}
  .sec{padding:78px 0}
  .shead{margin-bottom:34px}
  .social .sociallinks{gap:30px}
}
@media(max-width:620px){
  .wrap{padding:0 20px}
  .sec{padding:64px 0}
  .sgrid,.mgrid,.twogrid{grid-template-columns:1fr!important}
  .iggrid{grid-template-columns:repeat(3,1fr)!important}
  .hero h1{font-size:clamp(2.9rem,12vw,4rem)!important}
  .herobtns{width:100%;max-width:320px;margin-left:auto;margin-right:auto}
  .herobtns .btn,.band .btn{width:100%;text-align:center}
  .reel .slide{width:210px;height:270px}
  .fgrid{grid-template-columns:1fr;gap:34px;text-align:center}
  .fbrand .logo{margin:0 auto}
  .fcol h4{margin-top:8px}
  .band .c{padding:0 24px}
  .quote{padding:70px 24px}
  .quote blockquote{font-size:1.5rem}
  .revcard{padding:32px 26px}
}
@media(max-width:400px){
  .iggrid{grid-template-columns:repeat(2,1fr)!important}
  .reel .slide{width:168px;height:220px}
}