/* ============================================================
   The Portrait Studio — stylesheet
   ============================================================ */

:root{
  --bg:            #0a0908;
  --bg-alt:        #110f0c;
  --bg-card:       #15130f;
  --ink:           #f4efe6;
  --ink-muted:     #b7ae9e;
  --ink-faint:     #7d766a;
  --gold:          #fe8d13;
  --gold-soft:     #ffb663;
  --gold-dim:      rgba(254,141,19,0.28);
  --line:          rgba(244,239,230,0.10);
  --glass:         rgba(244,239,230,0.06);
  --glass-strong:  rgba(244,239,230,0.10);
  --shadow:        0 20px 60px rgba(0,0,0,0.45);
  --radius-lg:     28px;
  --radius-md:     18px;
  --radius-sm:     999px;
  --cream:         #f8f2e7;
  --cream-ink:     #211a12;
  --cream-muted:   #6b5c47;
  --cream-line:    rgba(33,26,18,0.10);
  --cream-gold:    #b8620b;
  --serif:         'Cormorant Garamond','Playfair Display',Georgia,'Times New Roman',serif;
  --sans:          'Jost','Helvetica Neue',Arial,sans-serif;
  --ease:          cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea,select{font-family:inherit;color:inherit;}
.container{width:min(1240px,92%);margin-inline:auto;}
section{position:relative;}
.hidden{display:none !important;}

/* ---------- typography helpers ---------- */
.eyebrow{
  font-family:var(--sans);
  font-size:.72rem;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--gold-soft);
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--gold);display:inline-block;}
.section-head{margin-bottom:56px;max-width:640px;}
.section-head h2{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(2.2rem,4vw,3.4rem);
  line-height:1.1;
  margin-top:18px;
  color:var(--ink);
}
.section-head p{margin-top:18px;color:var(--ink-muted);font-size:1.02rem;max-width:520px;}
.section-head.center{margin-inline:auto;text-align:center;}
.section-head.center::before{margin-inline:auto;}
.section-head.center p{margin-inline:auto;}

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:16px 30px;
  border-radius:var(--radius-sm);
  font-size:.78rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  font-weight:500;
  transition:transform .35s var(--ease),background .35s var(--ease),border-color .35s var(--ease),color .35s var(--ease);
  white-space:nowrap;
}
.btn svg{width:14px;height:14px;flex-shrink:0;}
.btn-glass{
  background:var(--glass);
  border:1px solid var(--glass-strong);
  color:var(--ink);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.btn-glass:hover{background:var(--glass-strong);transform:translateY(-2px);}
.btn-gold{
  background:linear-gradient(135deg,var(--gold-soft),var(--gold));
  color:#1a1409;
}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(254,141,19,0.28);}
.btn-outline{
  border:1px solid var(--gold-dim);
  color:var(--gold-soft);
}
.btn-outline:hover{border-color:var(--gold);background:rgba(254,141,19,0.08);}
.btn-block{width:100%;justify-content:center;}
.btn-sm{padding:11px 20px;font-size:.7rem;}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  padding:26px 0;
  transition:padding .4s var(--ease),background .4s var(--ease),border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  padding:16px 0;
  background:rgba(10,9,8,0.86);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.nav .container{display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:12px;}
.brand-icon{width:36px;height:36px;flex-shrink:0;}
.brand-icon img{width:100%;height:100%;object-fit:contain;display:block;}
.brand-icon-sm{width:24px;height:24px;}
.brand-text{display:flex;flex-direction:column;line-height:1;}
.foot-brand{display:flex;align-items:center;gap:10px;}
.brand .name{
  font-family:var(--serif);
  font-size:1.5rem;
  letter-spacing:.14em;
  color:var(--ink);
}
.brand .sub{
  font-size:.6rem;
  letter-spacing:.38em;
  color:var(--gold-soft);
  margin-top:4px;
}
.nav-links{display:flex;gap:38px;align-items:center;}
.nav-links a{
  font-size:.74rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink-muted);
  position:relative;
  padding-bottom:6px;
  transition:color .3s var(--ease);
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);
  transition:width .35s var(--ease);
}
.nav-links a:hover,.nav-links a.active{color:var(--ink);}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}

.nav-actions{display:flex;align-items:center;gap:14px;}
.icon-btn{
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--glass);
  border:1px solid var(--glass-strong);
  position:relative;
  transition:background .3s var(--ease),transform .3s var(--ease);
}
.icon-btn:hover{background:var(--glass-strong);transform:translateY(-2px);}
.icon-btn svg{width:17px;height:17px;}
.cart-badge{
  position:absolute;top:-4px;right:-4px;
  min-width:18px;height:18px;padding:0 4px;
  border-radius:50%;
  background:var(--gold);
  color:#1a1409;
  font-size:.62rem;
  font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.menu-toggle{display:none;}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height:100vh;
  display:flex;
  align-items:flex-end;
  padding:160px 0 90px;
  position:relative;
  isolation:isolate;
}
.hero-bg{position:absolute;inset:0;z-index:-2;}
.hero-bg img{width:100%;height:100%;object-fit:cover;}
.hero-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,9,8,.35) 0%,rgba(10,9,8,.15) 35%,rgba(10,9,8,.55) 75%,rgba(10,9,8,.96) 100%);
}
.hero-content{max-width:760px;}
.hero-content h1{
  font-family:var(--serif);
  font-weight:500;
  font-size:clamp(3rem,7.2vw,5.6rem);
  line-height:1.02;
  margin-top:22px;
  color:var(--ink);
}
.hero-content h1 em{font-style:italic;color:var(--gold-soft);}
.hero-content .lede{
  margin-top:26px;
  color:var(--ink-muted);
  font-size:1.08rem;
  max-width:480px;
}
.hero-actions{display:flex;gap:18px;align-items:center;margin-top:42px;flex-wrap:wrap;}
.scroll-cue{
  position:absolute;right:calc(4% + 8px);bottom:70px;
  display:flex;align-items:center;gap:14px;
  color:var(--ink-faint);
  font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;
}
.scroll-cue .ring{
  width:44px;height:44px;border-radius:50%;
  border:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:center;
  animation:bob 2.6s ease-in-out infinite;
}
.scroll-cue .ring svg{width:14px;height:14px;color:var(--gold);}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}

.hero-stats{
  position:absolute;top:130px;right:calc(4%);
  display:flex;flex-direction:column;gap:14px;
  z-index:2;
}
.hero-stat{
  display:flex;align-items:center;gap:14px;
  background:rgba(10,9,8,.55);
  border:1px solid var(--glass-strong);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-radius:var(--radius-md);
  padding:14px 22px;
  min-width:190px;
}
.hs-icon{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.hs-icon svg{width:17px;height:17px;color:var(--gold);}
.hero-stat b{font-family:var(--serif);font-size:1.4rem;color:var(--gold-soft);display:block;line-height:1;}
.hero-stat span{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);}

/* ============================================================
   CATEGORY STRIP
   ============================================================ */
.cat-strip-wrap{
  position:relative;z-index:6;
  margin-top:-38px;
}
.cat-strip{
  background:var(--cream);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
  padding:22px 30px;
  display:flex;
  justify-content:space-between;
  gap:8px;
  overflow-x:auto;
}
.cat-pill{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  min-width:84px;
  color:var(--cream-ink);
  transition:transform .3s var(--ease);
}
.cat-pill:hover{transform:translateY(-4px);}
.cp-icon{
  width:46px;height:46px;border-radius:14px;
  background:linear-gradient(135deg,#fbe0c0,rgba(254,141,19,.15));
  display:flex;align-items:center;justify-content:center;
}
.cp-icon svg{width:20px;height:20px;color:var(--cream-gold);}
.cat-pill span:last-child{font-size:.68rem;letter-spacing:.03em;text-align:center;color:var(--cream-ink);}

/* ============================================================
   TRIPTYCH (Films / Moments / Experience)
   ============================================================ */
.triptych{padding:64px 0 120px;position:relative;z-index:5;}
.triptych-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.tri-card{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:3/4;
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  transition:transform .5s var(--ease);
}
.tri-card:hover{transform:translateY(-8px);}
.tri-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);}
.tri-card:hover img{transform:scale(1.06);}
.tri-card .overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,9,8,.15) 0%,rgba(10,9,8,.1) 40%,rgba(10,9,8,.92) 100%);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:26px;
}
.tri-card .top-row{display:flex;justify-content:space-between;align-items:flex-start;}
.tri-card .index{font-family:var(--serif);font-size:1.1rem;color:var(--gold-soft);}
.tri-card .go{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--glass-strong);
  background:var(--glass);
  display:flex;align-items:center;justify-content:center;
  transition:background .3s var(--ease),transform .3s var(--ease);
}
.tri-card:hover .go{background:var(--gold);transform:rotate(45deg);}
.tri-card:hover .go svg{color:#1a1409;}
.tri-card .go svg{width:14px;height:14px;}
.tri-card .bottom h3{font-family:var(--serif);font-size:1.7rem;font-weight:500;margin-bottom:8px;}
.tri-card .bottom p{color:var(--ink-muted);font-size:.85rem;}

/* ============================================================
   ABOUT
   ============================================================ */
.about{padding:120px 0;background:var(--bg-alt);}
.about .container{display:grid;grid-template-columns:.85fr 1fr;gap:80px;align-items:center;}
.about-media{position:relative;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:4/5;border:1px solid var(--line);}
.about-media img{width:100%;height:100%;object-fit:cover;}
.about-stats{
  position:absolute;left:-30px;bottom:-30px;
  background:rgba(10,9,8,.86);
  backdrop-filter:blur(16px);
  border:1px solid var(--glass-strong);
  border-radius:var(--radius-md);
  padding:26px 30px;
  display:flex;gap:34px;
}
.about-stats .stat b{font-family:var(--serif);font-size:2.1rem;color:var(--gold-soft);display:block;}
.about-stats .stat span{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted);}
.about-copy p{color:var(--ink-muted);margin-top:18px;max-width:520px;}
.about-list{margin-top:34px;display:flex;flex-direction:column;gap:16px;}
.about-list li{display:flex;gap:14px;align-items:flex-start;font-size:.95rem;color:var(--ink);}
.about-list svg{width:18px;height:18px;color:var(--gold);flex-shrink:0;margin-top:3px;}

/* ============================================================
   PORTFOLIO
   ============================================================ */
.portfolio{padding:120px 0;}
.portfolio-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:50px;}
.filter-row{display:flex;gap:10px;flex-wrap:wrap;}
.filter-btn{
  padding:10px 20px;border-radius:var(--radius-sm);
  border:1px solid var(--line);
  font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-muted);
  transition:all .3s var(--ease);
}
.filter-btn.active,.filter-btn:hover{border-color:var(--gold);color:var(--gold-soft);background:rgba(254,141,19,.08);}
.portfolio-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.p-item{
  position:relative;border-radius:var(--radius-md);overflow:hidden;
  aspect-ratio:3/4;border:1px solid var(--line);cursor:pointer;
}
.p-item:nth-child(3n+2){aspect-ratio:3/4.6;}
.p-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.p-item:hover img{transform:scale(1.08);}
.p-item .tag{
  position:absolute;left:16px;bottom:16px;
  font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink);
  background:rgba(10,9,8,.55);
  padding:8px 14px;border-radius:var(--radius-sm);
  border:1px solid var(--glass-strong);
  opacity:0;transform:translateY(8px);
  transition:all .35s var(--ease);
}
.p-item:hover .tag{opacity:1;transform:translateY(0);}

/* PACKAGES page → see builder.css */

.how-it-works{
  margin-top:64px;
  display:flex;justify-content:space-between;gap:14px;
  padding:40px;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--bg-card);
}
.hiw-step{
  flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;
  position:relative;
}
.hiw-step:not(:last-child)::after{
  content:"";position:absolute;top:22px;left:calc(50% + 34px);width:calc(100% - 44px);height:1px;
  background:var(--line);
}
.hiw-step .num{
  width:44px;height:44px;border-radius:50%;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold));
  color:#1a1409;font-family:var(--serif);font-size:1.1rem;
  display:flex;align-items:center;justify-content:center;
  z-index:1;
}
.hiw-step h5{font-size:.85rem;font-weight:600;}
.hiw-step p{font-size:.74rem;color:var(--ink-muted);}

/* ============================================================
   TESTIMONIAL
   ============================================================ */
.testimonial{padding:100px 0;}
.testimonial .container{max-width:820px;text-align:center;}
.quote-mark{font-family:var(--serif);font-size:5rem;color:var(--gold);line-height:1;opacity:.7;}
.testimonial blockquote{
  font-family:var(--serif);font-weight:400;font-style:italic;
  font-size:clamp(1.5rem,2.6vw,2.1rem);
  line-height:1.4;color:var(--ink);margin-top:6px;
}
.testimonial cite{display:block;margin-top:26px;font-style:normal;color:var(--gold-soft);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;}

/* ============================================================
   EXPERIENCE INFO CARDS
   ============================================================ */
.info-cards{padding:0 0 120px;}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.info-card{
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:40px;
  display:flex;flex-direction:column;align-items:flex-start;gap:16px;
}
.info-card .icon{
  width:52px;height:52px;border-radius:50%;
  border:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:center;
}
.info-card .icon svg{width:22px;height:22px;color:var(--gold);}
.info-card h4{font-family:var(--serif);font-size:1.25rem;font-weight:500;}
.info-card p{color:var(--ink-muted);font-size:.88rem;}
.info-card p a:hover{color:var(--gold-soft);}
.insta-strip{display:flex;gap:10px;margin-top:6px;}
.insta-strip img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:1px solid var(--line);}

/* ============================================================
   CONTACT
   ============================================================ */
.contact{padding:120px 0;background:var(--bg-alt);}
.contact .container{display:grid;grid-template-columns:.85fr 1fr;gap:70px;}
.contact-info{display:flex;flex-direction:column;gap:28px;}
.contact-item{display:flex;gap:16px;align-items:flex-start;}
.contact-item .icon{
  width:46px;height:46px;border-radius:50%;flex-shrink:0;
  border:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:center;
}
.contact-item .icon svg{width:18px;height:18px;color:var(--gold);}
.contact-item h5{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:4px;}
.contact-item p,.contact-item a{font-size:1rem;color:var(--ink);}
.contact-form{
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:40px;
  display:flex;flex-direction:column;gap:18px;
}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.field input,.field select,.field textarea{
  background:rgba(244,239,230,.04);
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px 16px;
  font-size:.92rem;
  color:var(--ink);
  transition:border-color .3s var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold-dim);}
.field textarea{resize:vertical;min-height:100px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}

/* FOOTER → see pages.css */

/* ============================================================
   CART DRAWER
   ============================================================ */
.overlay-scrim{
  position:fixed;inset:0;background:rgba(0,0,0,.6);
  backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .4s var(--ease);
  z-index:300;
}
.overlay-scrim.show{opacity:1;pointer-events:auto;}

.cart-drawer{
  position:fixed;top:0;right:0;bottom:0;
  width:min(440px,100%);
  background:#0d0c0a;
  border-left:1px solid var(--line);
  z-index:301;
  display:flex;flex-direction:column;
  transform:translateX(100%);
  transition:transform .5s var(--ease);
}
.cart-drawer.open{transform:translateX(0);}
.cart-head{
  padding:28px 28px 20px;
  display:flex;justify-content:space-between;align-items:center;
  border-bottom:1px solid var(--line);
}
.cart-head h3{font-family:var(--serif);font-size:1.5rem;}
.cart-close{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;}
.cart-close svg{width:15px;height:15px;}
.cart-items{flex:1;overflow-y:auto;padding:20px 28px;display:flex;flex-direction:column;gap:18px;}
.cart-empty{margin:auto;text-align:center;color:var(--ink-faint);padding:60px 0;}
.cart-empty svg{width:40px;height:40px;color:var(--ink-faint);margin-bottom:14px;}
.cart-item{
  display:flex;gap:14px;padding:16px;
  background:var(--bg-card);
  border:1px solid var(--line);
  border-radius:14px;
}
.cart-item .ci-info{flex:1;}
.cart-item .ci-cat{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-soft);}
.cart-item .ci-name{font-family:var(--serif);font-size:1.15rem;margin-top:2px;}
.cart-item .ci-price{font-size:.85rem;color:var(--ink-muted);margin-top:6px;}
.cart-item .ci-actions{display:flex;align-items:center;gap:10px;margin-top:10px;}
.qty-btn{width:26px;height:26px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;}
.qty-val{min-width:18px;text-align:center;font-size:.85rem;}
.ci-remove{font-size:.68rem;letter-spacing:.08em;color:var(--ink-faint);text-decoration:underline;text-underline-offset:3px;margin-left:auto;}
.ci-remove:hover{color:var(--gold-soft);}
.cart-footer{padding:24px 28px 30px;border-top:1px solid var(--line);}
.cart-total-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;}
.cart-total-row span{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.cart-total-row b{font-family:var(--serif);font-size:1.9rem;color:var(--gold-soft);}
.cart-note{font-size:.72rem;color:var(--ink-faint);margin-top:14px;line-height:1.5;}

/* ============================================================
   CHECKOUT MODAL
   ============================================================ */
.modal{
  position:fixed;inset:0;z-index:400;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;pointer-events:none;
  transition:opacity .35s var(--ease);
}
.modal.show{opacity:1;pointer-events:auto;}
.modal-box{
  width:min(560px,100%);
  max-height:88vh;overflow-y:auto;
  background:#0d0c0a;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:40px;
  transform:translateY(20px) scale(.98);
  transition:transform .4s var(--ease);
}
.modal.show .modal-box{transform:translateY(0) scale(1);}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px;}
.modal-head h3{font-family:var(--serif);font-size:1.8rem;}
.modal-head p{color:var(--ink-muted);font-size:.88rem;margin-top:10px;}
.modal-close{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.modal-close svg{width:14px;height:14px;}
.modal-summary{
  margin:22px 0;padding:16px;
  background:rgba(254,141,19,.06);
  border:1px solid var(--gold-dim);
  border-radius:14px;
  font-size:.85rem;color:var(--ink-muted);
}
.modal-summary b{color:var(--gold-soft);}
.modal-form{display:flex;flex-direction:column;gap:16px;margin-top:10px;}
.modal-actions{display:flex;gap:14px;margin-top:24px;flex-wrap:wrap;}
.modal-actions .btn{flex:1;justify-content:center;}
.success-box{text-align:center;padding:30px 10px;}
.success-box .check{
  width:64px;height:64px;border-radius:50%;
  background:rgba(254,141,19,.12);
  border:1px solid var(--gold-dim);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 22px;
}
.success-box .check svg{width:26px;height:26px;color:var(--gold);}
.success-box h3{font-family:var(--serif);font-size:1.6rem;margin-bottom:10px;}
.success-box p{color:var(--ink-muted);font-size:.9rem;}

/* ============================================================
   TOAST
   ============================================================ */
.toast{
  position:fixed;bottom:30px;left:50%;
  transform:translate(-50%,20px);
  background:#161310;
  border:1px solid var(--gold-dim);
  color:var(--ink);
  padding:14px 26px;border-radius:var(--radius-sm);
  font-size:.82rem;
  display:flex;align-items:center;gap:10px;
  opacity:0;pointer-events:none;
  transition:all .4s var(--ease);
  z-index:500;
}
.toast.show{opacity:1;transform:translate(-50%,0);}
.toast svg{width:16px;height:16px;color:var(--gold);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .hero-stats{display:none;}
  .triptych-grid{grid-template-columns:1fr;}
  .about .container{grid-template-columns:1fr;}
  .about-media{max-width:440px;margin-inline:auto;}
  .portfolio-grid{grid-template-columns:repeat(2,1fr);}
  .info-grid{grid-template-columns:1fr;}
  .contact .container{grid-template-columns:1fr;}
  .builder-panel{grid-template-columns:1fr;padding:30px;}
  .summary-card{position:static;}
  .how-it-works{flex-wrap:wrap;}
  .hiw-step{flex:1 1 40%;}
  .hiw-step::after{display:none;}
}
@media (max-width:760px){
  .nav-links{
    position:fixed;top:0;right:0;bottom:0;
    width:min(320px,84%);
    background:#0d0c0a;
    border-left:1px solid var(--line);
    flex-direction:column;
    align-items:flex-start;
    padding:110px 34px 40px;
    gap:26px;
    transform:translateX(100%);
    transition:transform .45s var(--ease);
    z-index:250;
  }
  .nav-links.open{transform:translateX(0);}
  .menu-toggle{display:flex;}
  .hero{padding-top:130px;}
  .field-row{grid-template-columns:1fr;}
  .portfolio-grid{grid-template-columns:1fr 1fr;}
  .portfolio-head{flex-direction:column;align-items:flex-start;}
  .about-stats{position:static;margin-top:20px;}
  .service-grid{grid-template-columns:1fr 1fr;}
  .hiw-step{flex:1 1 100%;}
  .cat-strip{justify-content:flex-start;}
}
@media (max-width:520px){
  .portfolio-grid{grid-template-columns:1fr;}
  .hero-actions{flex-direction:column;align-items:stretch;}
  .scroll-cue{display:none;}
}
