/* Self-hosted brand fonts. Generated 18 Aug 2026 from the Google Fonts CSS.
   Removes two third-party DNS/TLS handshakes and a render-blocking request.
   To refresh: re-run the snippet in build/README-fonts.md. */

@font-face{
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-italic-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-italic-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-500-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Cormorant Garamond';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/CormorantGaramond-normal-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url('/fonts/Mulish-normal-300-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:300;
  font-display:swap;
  src:url('/fonts/Mulish-normal-300-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/Mulish-normal-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/Mulish-normal-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/Mulish-normal-500-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:500;
  font-display:swap;
  src:url('/fonts/Mulish-normal-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/Mulish-normal-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Mulish';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src:url('/fonts/Mulish-normal-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Parisienne';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/Parisienne-normal-400-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Parisienne';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/Parisienne-normal-400-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== The Prom Collection, shared styles (Blush Bloom palette) ===== */
:root{
  --ivory:#FFF6F6;
  --blush:#FBE6EA;
  --champagne:#F3D7DA;
  --champagne-soft:#FBEAEC;
  --rose:#B85C7A;
  --rose-deep:#9A4763;
  --taupe:#5C3A47;
  --taupe-70:rgba(92,58,71,.72);
  --taupe-45:rgba(92,58,71,.45);
  --line:rgba(184,92,122,.22);
  --shadow:0 24px 60px -28px rgba(92,58,71,.45);
  --shadow-soft:0 18px 50px -30px rgba(92,58,71,.35);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Mulish",-apple-system,BlinkMacSystemFont,sans-serif;
  --script:"Parisienne",cursive;
  --arch:50% 50% 14px 14px / 26% 26% 3% 3%;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);color:var(--taupe);background:var(--ivory);
  font-weight:300;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.08;color:var(--taupe)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}

.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 22px}
.skip{position:absolute;left:-999px;top:0;background:var(--rose);color:#fff;padding:10px 16px;z-index:200;border-radius:0 0 8px 0}
.skip:focus{left:0}

.eyebrow{font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--rose)}
.script{font-family:var(--script);font-weight:400;color:var(--rose);font-size:1.18em;line-height:1}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--sans);font-weight:500;letter-spacing:.04em;font-size:.84rem;padding:.92em 1.9em;border-radius:999px;transition:.45s cubic-bezier(.2,.7,.3,1);white-space:nowrap}
.btn-primary{background:var(--rose);color:#fff;box-shadow:0 14px 30px -14px rgba(154,71,99,.7)}
.btn-primary:hover{background:var(--rose-deep);transform:translateY(-2px);box-shadow:0 20px 38px -16px rgba(154,71,99,.8)}
.btn-ghost{border:1px solid var(--line);color:var(--taupe);background:rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:var(--rose);color:var(--rose);background:#fff}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
.btn-disabled,.btn:disabled{background:var(--champagne);color:var(--taupe-45);box-shadow:none;cursor:not-allowed;pointer-events:none;transform:none}

/* Announcement */
.announce{background:var(--rose);color:var(--blush);text-align:center;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;padding:9px 16px;position:relative;z-index:60}
.announce b{color:#fff;font-weight:600}
.announce .dot{opacity:.55;margin:0 .7em}
.announce a{color:inherit;display:inline-block;padding:2px 0}
.announce a:hover{color:#fff}
.announce a b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* ---- EVENT: The Dress Rehearsal, 18 Oct 2026 ----
   The homepage promo strip. Everything for the event is prefixed .dr-
   so the whole promotion can be lifted out in one go afterwards: delete
   this block, the <section class="dr-strip-sec"> in index.html, and the
   page files themselves. See PUSH-DRESS-REHEARSAL-2026-09-09.cmd. */
.dr-strip-sec{padding:clamp(38px,5.5vw,70px) 0 0}
.dr-strip{
  background:#3A222C;color:#F7E9EC;border-radius:16px;
  display:flex;align-items:center;justify-content:space-between;gap:clamp(18px,3vw,40px);
  padding:clamp(24px,3vw,36px) clamp(24px,3.4vw,42px);flex-wrap:wrap;
}
.dr-strip .dr-strip-copy{flex:1 1 340px}
.dr-strip .eyebrow{color:#E4C08D;display:block;margin-bottom:9px}
.dr-strip h2{color:#fff;font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.15rem);font-weight:500;margin-bottom:9px;line-height:1.1}
.dr-strip p{color:rgba(247,233,236,.78);font-size:.95rem;max-width:56ch}
.dr-strip .btn-light{background:#fff;color:var(--rose-deep);box-shadow:0 14px 30px -16px rgba(0,0,0,.55)}
.dr-strip .btn-light:hover{background:var(--ivory);transform:translateY(-2px)}
/* ---- end EVENT block ---- */

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,246,246,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);transition:padding .4s ease, box-shadow .4s ease}
.nav.shrunk{box-shadow:0 10px 30px -22px rgba(92,58,71,.5)}
.nav-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;padding:16px 22px;max-width:1180px;margin:0 auto;transition:padding .4s ease}
.nav.shrunk .nav-inner{padding-top:11px;padding-bottom:11px}
.brand{grid-column:2;text-align:center;line-height:1}
.brand .name{font-family:var(--serif);font-size:1.42rem;font-weight:600;letter-spacing:.02em;color:var(--taupe);display:block}
.brand .strap{font-family:var(--sans);font-size:.56rem;letter-spacing:.42em;text-transform:uppercase;color:var(--rose);margin-top:3px}
.nav-links{display:flex;align-items:center;gap:30px;font-size:.82rem;letter-spacing:.06em;color:var(--taupe-70)}
.nav-links.left{grid-column:1}
.nav-links a{position:relative;padding:4px 0;transition:color .3s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--rose);transition:width .35s ease}
.nav-links a:hover,.nav-links a.active{color:var(--rose)}
.nav-links a.active::after,.nav-links a:hover::after{width:100%}
.nav-right{grid-column:3;display:flex;justify-content:flex-end;align-items:center;gap:18px}
.nav-right .nav-links{justify-content:flex-end}
.nav-book{font-size:.8rem;padding:.7em 1.5em}
.burger{display:none;flex-direction:column;gap:4.5px;padding:8px;margin-right:-8px}
.burger span{width:22px;height:1.5px;background:var(--taupe);transition:.3s}
.burger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Mobile drawer */
.drawer{position:fixed;inset:0;z-index:80;background:var(--ivory);transform:translateY(-100%);transition:transform .5s cubic-bezier(.6,0,.2,1);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;visibility:hidden}
.drawer.open{transform:translateY(0);visibility:visible}
.drawer a{font-family:var(--serif);font-size:2rem;color:var(--taupe);padding:10px}
.drawer a:hover{color:var(--rose)}
.drawer .btn{margin-top:18px;font-size:.95rem}
.drawer .d-close{position:absolute;top:22px;right:24px;font-size:1.8rem;color:var(--rose);line-height:1}

/* HERO */
.hero{position:relative;padding:clamp(34px,7vw,76px) 0 clamp(50px,7vw,92px);overflow:hidden}
#hero3d{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 1.4s ease}
#hero3d.ready{opacity:.34}
.hero .wrap{position:relative;z-index:1}
html[data-three="off"] #hero3d{display:none}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 90% at 12% 0%, var(--blush) 0%, transparent 55%),radial-gradient(120% 100% at 100% 30%, var(--champagne-soft) 0%, transparent 60%),var(--ivory)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center}
.hero-copy{max-width:540px}
.hero h1{font-size:clamp(2.9rem,6.6vw,5rem);margin:.32em 0 .26em;letter-spacing:-.01em}
.hero h1 em{font-style:normal}
.hero p.lede{font-size:1.06rem;color:var(--taupe-70);max-width:430px;font-weight:300}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.hero-meta{display:flex;gap:26px;margin-top:34px;align-items:center;flex-wrap:wrap}
.hero-meta .m{display:flex;flex-direction:column}
.hero-meta .m b{font-family:var(--serif);font-size:1.5rem;font-weight:600;color:var(--rose);line-height:1}
.hero-meta .m span{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--taupe-45);margin-top:6px}
.hero-meta .div{width:1px;height:34px;background:var(--line)}
.hero-art{position:relative}
.hero-frame{position:relative;border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow);background:var(--champagne-soft)}
.hero-frame img{width:100%;height:clamp(420px,58vw,640px);object-fit:cover;object-position:center 18%}
.hero-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(154,71,99,.14));pointer-events:none}
.hero-badge{position:absolute;left:-14px;bottom:34px;background:rgba(255,246,246,.97);padding:16px 20px 15px;border-radius:16px;box-shadow:var(--shadow-soft);max-width:230px;border:1px solid rgba(255,255,255,.7)}
.hero-badge .seal{font-family:var(--script);color:var(--rose);font-size:1.7rem;line-height:.9}
.hero-badge p{font-size:.74rem;line-height:1.5;color:var(--taupe-70);margin-top:5px}

/* Section scaffold */
section{position:relative}
.sec-head{text-align:center;max-width:640px;margin:0 auto clamp(34px,5vw,54px)}
.sec-head h2{font-size:clamp(2.1rem,4.6vw,3.3rem);margin:.28em 0 .3em}
.sec-head p{color:var(--taupe-70);font-size:1.02rem}
.divider{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 auto;width:fit-content}
.divider .l{width:46px;height:1px;background:var(--line)}
.divider .d{width:6px;height:6px;background:var(--rose);transform:rotate(45deg);opacity:.7}

/* PROMISE band */
.promise{padding:clamp(56px,8vw,104px) 0;background:linear-gradient(180deg,var(--blush),var(--champagne-soft));position:relative;overflow:hidden}
.promise::before,.promise::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.4);filter:blur(8px)}
.promise::before{width:280px;height:280px;left:-90px;top:-80px}
.promise::after{width:340px;height:340px;right:-120px;bottom:-140px;background:rgba(184,92,122,.08)}
.promise-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,5vw,68px);align-items:center;position:relative}
.promise-art{border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow);background:var(--champagne-soft)}
.promise-art img{width:100%;height:clamp(360px,46vw,520px);object-fit:cover;object-position:center 22%}
.promise-copy h2{font-size:clamp(2.4rem,5.4vw,3.7rem);letter-spacing:-.01em}
.promise-copy h2 .script{display:block;font-size:.62em;margin-bottom:.04em}
.promise-copy p{color:var(--taupe-70);font-size:1.08rem;margin-top:22px;max-width:500px}
.promise-points{list-style:none;margin-top:28px;display:flex;flex-direction:column;gap:14px}
.promise-points li{display:flex;gap:14px;align-items:flex-start;font-size:.96rem;color:var(--taupe)}
.promise-points .tick{flex:none;width:26px;height:26px;border-radius:50%;background:#fff;color:var(--rose);display:grid;place-items:center;box-shadow:var(--shadow-soft);margin-top:1px}
.promise-points .tick svg{width:13px;height:13px}

/* COLLECTION grid */
.collection{padding:clamp(58px,8vw,108px) 0}
.gowns{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,26px)}
.gowns.grid-3{grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,32px)}
.gown{display:flex;flex-direction:column;position:relative;color:inherit;cursor:pointer}
.gown-img{position:relative;border-radius:var(--arch);overflow:hidden;background:var(--champagne-soft);box-shadow:var(--shadow-soft);isolation:isolate;transition:box-shadow .55s cubic-bezier(.2,.7,.3,1)}
.gown:hover .gown-img{box-shadow:var(--shadow)}
.gown-img img{width:100%;aspect-ratio:7/10;object-fit:cover;transition:opacity .7s ease,transform 1.1s cubic-bezier(.2,.7,.3,1)}
.gown-img .back{position:absolute;inset:0;opacity:0}
.gown:hover .gown-img .front{opacity:0}
.gown:hover .gown-img .back{opacity:1}
.gown:hover .gown-img img{transform:scale(1.04)}
.gown-tag{position:absolute;top:14px;left:14px;z-index:5;background:rgba(255,246,246,.96);color:var(--rose);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;padding:6px 11px;border-radius:999px}
.gown-soon{position:absolute;top:14px;right:14px;z-index:5;background:var(--rose,#A76A7B);color:#fff;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:6px 11px;border-radius:999px;box-shadow:0 2px 10px rgba(167,106,123,.35)}
.gown-zoom{position:absolute;right:12px;bottom:12px;width:36px;height:36px;border-radius:50%;background:rgba(255,246,246,.92);display:grid;place-items:center;opacity:0;transform:translateY(6px);transition:.4s;z-index:4}
.gown:hover .gown-zoom{opacity:1;transform:translateY(0)}
.gown-zoom svg{width:15px;height:15px;color:var(--rose)}
.gown-body{padding:18px 4px 0;display:flex;flex-direction:column;flex:1}
.gown-body h3{font-size:1.5rem;font-weight:600}
.gown-style{font-size:.78rem;letter-spacing:.04em;color:var(--taupe-45);margin-top:3px}
.gown-foot{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.gown-price{font-family:var(--serif);font-size:1.18rem;color:var(--taupe);font-weight:600}
.gown-price.poa{font-size:1rem;letter-spacing:.02em;color:var(--rose)}
.gown-price small{font-family:var(--sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-45);font-weight:600;display:block;margin-bottom:-2px}
.gown-book{font-size:.74rem;font-weight:600;letter-spacing:.04em;color:var(--rose);display:inline-flex;align-items:center;gap:6px;transition:.3s}
.gown-book svg{width:13px;height:13px;transition:transform .3s}
.gown:hover .gown-book{color:var(--rose-deep)}
.gown:hover .gown-book svg{transform:translateX(4px)}
.gown-colours{display:flex;gap:6px;margin-top:10px}
.gown-colours i{width:13px;height:13px;border-radius:50%;border:1px solid rgba(0,0,0,.08);display:block}
.collection .more{text-align:center;margin-top:clamp(34px,5vw,52px)}

/* PAGE HEADER (collection / dress) */
.page-head{padding:clamp(40px,6vw,74px) 0 clamp(20px,3vw,30px);text-align:center;position:relative;background:radial-gradient(120% 130% at 50% -10%, var(--blush) 0%, transparent 60%)}
.breadcrumb{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-45);margin-bottom:14px}
.breadcrumb a{transition:color .3s}.breadcrumb a:hover{color:var(--rose)}
.breadcrumb .sep{margin:0 .55em;opacity:.5}
.page-head h1{font-size:clamp(2.6rem,6vw,4.4rem);letter-spacing:-.01em}
.page-head h1 .script{font-size:.9em}
.page-head p{max-width:560px;margin:16px auto 0;color:var(--taupe-70);font-size:1.04rem}
.cat-tabs{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:clamp(22px,3vw,30px) 0 0}
.cat-tab{font-size:.78rem;letter-spacing:.07em;padding:.62em 1.5em;border-radius:999px;border:1px solid var(--line);color:var(--taupe-70);background:rgba(255,255,255,.55);transition:.3s}
.cat-tab:hover{border-color:var(--rose);color:var(--rose)}
.cat-tab.on{background:var(--rose);color:#fff;border-color:var(--rose)}
.collection-page{padding:clamp(34px,5vw,56px) 0 clamp(58px,8vw,104px)}
.coll-count{text-align:center;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe-45);margin-bottom:clamp(26px,3vw,38px)}

/* +N more colours pill on cards */
.gown-more{font-size:.6rem;font-weight:600;color:var(--taupe-45);align-self:center;margin-left:2px;letter-spacing:.04em}

/* ===== One Dress Per School, filter bar ===== */
.filter-wrap{max-width:980px;margin:0 auto clamp(30px,4vw,46px)}
.filter-intro{text-align:center;font-size:.98rem;color:var(--taupe-70);max-width:640px;margin:0 auto clamp(18px,2.4vw,26px);line-height:1.6}
.filter-intro b{color:var(--rose);font-weight:600}
.filter-bar{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-soft);padding:18px;display:flex;flex-direction:column;gap:16px}
/* primary pair, school + year, the special bit */
.filter-primary{display:grid;grid-template-columns:1.6fr 1fr;gap:14px;background:linear-gradient(135deg,var(--blush),var(--champagne-soft));border-radius:14px;padding:16px;position:relative}
.filter-primary::before{content:"♥";position:absolute;top:12px;right:14px;color:var(--rose);font-size:.9rem;opacity:.5}
.f-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.f-field label{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--rose);font-weight:600}
.f-field .hint{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--taupe-45);font-weight:600}
.f-field input,.f-field select{font-family:inherit;font-size:.94rem;color:var(--taupe);background:#fff;border:1px solid var(--line);border-radius:11px;padding:.74em .9em;transition:.3s;width:100%}
.f-field input:focus,.f-field select:focus{outline:none;border-color:var(--rose);box-shadow:0 0 0 3px rgba(184,92,122,.14)}
.filter-secondary{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.filter-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.applied-line{font-size:.9rem;color:var(--taupe);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.applied-line .pill{background:var(--rose);color:#fff;border-radius:999px;padding:.34em 1em;font-size:.76rem;font-weight:600;letter-spacing:.02em}
.applied-line.muted{color:var(--taupe-45)}
.btn-clear{font-size:.78rem;font-weight:600;color:var(--rose);letter-spacing:.04em;padding:.5em .9em;border-radius:999px;transition:.3s}
.btn-clear:hover{background:var(--blush)}
.explainer{margin-top:14px;border-top:1px solid var(--line);padding-top:14px}
.explainer summary{cursor:pointer;font-size:.82rem;font-weight:600;color:var(--rose);letter-spacing:.03em;list-style:none;display:inline-flex;align-items:center;gap:8px}
.explainer summary::-webkit-details-marker{display:none}
.explainer summary::before{content:"";width:7px;height:7px;border-right:1.5px solid var(--rose);border-bottom:1.5px solid var(--rose);transform:rotate(45deg);transition:transform .3s}
.explainer[open] summary::before{transform:rotate(225deg)}
.explainer p{font-size:.9rem;color:var(--taupe-70);margin-top:12px;max-width:640px;line-height:1.65}
.coll-status{text-align:center;font-size:.95rem;color:var(--taupe);margin-bottom:clamp(22px,3vw,32px);min-height:1.2em}
.coll-status b{color:var(--rose);font-weight:600}
.coll-empty{text-align:center;padding:clamp(40px,7vw,80px) 20px;color:var(--taupe-70)}
.coll-empty h3{font-size:1.8rem;font-weight:600;margin-bottom:10px}
.coll-empty p{max-width:380px;margin:0 auto}

/* Dress page availability note + taken swatch */
.avail-banner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--blush);border-radius:12px;padding:10px 14px;font-size:.84rem;color:var(--taupe);margin-bottom:20px}
.avail-banner .pill{background:var(--rose);color:#fff;border-radius:999px;padding:.28em .9em;font-size:.72rem;font-weight:600}
.avail-banner button{font-size:.76rem;font-weight:600;color:var(--rose);text-decoration:underline;text-underline-offset:2px}
.swatch.taken{opacity:.4;cursor:not-allowed;position:relative}
.swatch.taken .dot{box-shadow:none;filter:grayscale(.5)}
.swatch.taken::after{content:"Taken";position:absolute;top:9px;left:50%;transform:translateX(-50%) rotate(-8deg);font-size:.5rem;letter-spacing:.04em;color:var(--taupe);text-transform:uppercase;font-weight:700}
.detail-soldout{background:var(--blush);border-radius:14px;padding:18px 20px;font-size:.9rem;color:var(--taupe);margin-top:20px}
.detail-soldout b{color:var(--rose)}

/* ===== Social proof, reviews + social feed ===== */
.proof{padding:clamp(58px,8vw,104px) 0;background:linear-gradient(180deg,var(--ivory),var(--blush) 160%)}
.reviews-head{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:clamp(30px,4vw,46px)}
.reviews-score{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.reviews-score .num{font-family:var(--serif);font-size:2.6rem;font-weight:600;color:var(--taupe);line-height:1}
.reviews-score .stars{color:var(--rose);letter-spacing:.18em;font-size:1.05rem}
.reviews-score .meta{font-size:.78rem;letter-spacing:.04em;color:var(--taupe-45);text-align:left}
.reviews-score .ggl{font-weight:600;color:var(--taupe-70)}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)}
.review-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;gap:12px}
.review-card .stars{color:var(--rose);letter-spacing:.16em;font-size:.86rem}
.review-card p{font-size:.95rem;color:var(--taupe);line-height:1.6;flex:1}
.review-card .who{display:flex;align-items:center;gap:11px;margin-top:4px}
.review-card .avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--blush),var(--champagne));display:grid;place-items:center;font-family:var(--serif);font-weight:600;color:var(--rose);font-size:1.05rem;flex:none}
.review-card .who b{font-size:.86rem;font-weight:600;color:var(--taupe);display:block}
.review-card .who span{font-size:.7rem;letter-spacing:.06em;color:var(--taupe-45)}

.social-block{margin-top:clamp(46px,6vw,76px)}
.social-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.social-tile{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1;background:var(--champagne-soft);box-shadow:var(--shadow-soft);isolation:isolate}
.social-tile img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.3,1)}
.social-tile:hover img{transform:scale(1.06)}
.social-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(154,71,99,.28));opacity:0;transition:.4s}
.social-tile:hover::after{opacity:1}
.social-tile .ig{position:absolute;right:9px;bottom:8px;color:#fff;font-size:.62rem;letter-spacing:.06em;font-weight:600;opacity:0;transform:translateY(5px);transition:.4s;z-index:2}
.social-tile:hover .ig{opacity:1;transform:none}
.social-links{display:flex;justify-content:center;gap:14px;margin-top:clamp(26px,3vw,34px);flex-wrap:wrap}
.social-links a{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;font-weight:600;letter-spacing:.04em;color:var(--taupe);border:1px solid var(--line);background:#fff;border-radius:999px;padding:.6em 1.3em;transition:.3s}
.social-links a:hover{border-color:var(--rose);color:var(--rose)}
.social-links svg{width:15px;height:15px}

/* ===== Blog index grid ===== */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,34px)}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-soft);transition:transform .5s cubic-bezier(.2,.7,.3,1),box-shadow .5s}
.post-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.post-card .pc-img{aspect-ratio:3/2;overflow:hidden;background:var(--champagne-soft);isolation:isolate}
.post-card .pc-img img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:transform 1.1s cubic-bezier(.2,.7,.3,1)}
.post-card:hover .pc-img img{transform:scale(1.05)}
.post-card .pc-body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.post-card .pc-meta{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-45);font-weight:600;margin-bottom:10px;display:flex;gap:10px}
.post-card h3{font-size:1.45rem;font-weight:600;line-height:1.15}
.post-card p{font-size:.92rem;color:var(--taupe-70);margin-top:10px;flex:1}
.post-card .more{margin-top:16px;font-size:.78rem;font-weight:600;letter-spacing:.04em;color:var(--rose);display:inline-flex;align-items:center;gap:6px}
.post-card .more svg{width:13px;height:13px;transition:transform .3s}
.post-card:hover .more svg{transform:translateX(4px)}

/* ===== Blog post (article) ===== */
.article{padding:clamp(26px,4vw,44px) 0 clamp(58px,8vw,100px)}
.article-head{max-width:760px;margin:0 auto;text-align:center}
.article-head .meta{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-45);font-weight:600;display:flex;gap:12px;justify-content:center;margin-bottom:16px}
.article-head h1{font-size:clamp(2.4rem,5.2vw,3.8rem);letter-spacing:-.01em}
.article-hero{max-width:980px;margin:clamp(28px,4vw,44px) auto 0;border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/9;background:var(--champagne-soft);isolation:isolate}
.article-hero img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
.article-body{max-width:680px;margin:clamp(34px,5vw,56px) auto 0}
.article-body h2{font-size:clamp(1.6rem,3.2vw,2.2rem);margin:clamp(28px,4vw,40px) 0 14px;letter-spacing:-.01em}
.article-body p{font-size:1.06rem;color:var(--taupe);line-height:1.8;margin-bottom:18px}
.article-body p.lede{font-size:1.2rem;color:var(--taupe-70)}
.article-body ul{list-style:none;margin:0 0 20px;display:flex;flex-direction:column;gap:12px}
.article-body li{position:relative;padding-left:26px;font-size:1.02rem;color:var(--taupe);line-height:1.65}
.article-body li::before{content:"";position:absolute;left:2px;top:11px;width:7px;height:7px;background:var(--rose);transform:rotate(45deg);opacity:.7}
.article-body li b{font-weight:600}
.article-cta{max-width:680px;margin:clamp(36px,5vw,52px) auto 0;background:linear-gradient(135deg,var(--blush),var(--champagne-soft));border-radius:20px;padding:clamp(28px,4vw,40px);text-align:center}
.article-cta h3{font-size:clamp(1.6rem,3.4vw,2.3rem);font-weight:600;margin-bottom:10px}
.article-cta h3 .script{font-size:1.1em}
.article-cta p{color:var(--taupe-70);font-size:1rem;max-width:440px;margin:0 auto 22px}
.article-back{max-width:680px;margin:34px auto 0;text-align:center}
.article-back a{font-size:.8rem;font-weight:600;letter-spacing:.04em;color:var(--rose)}

@media(max-width:900px){
  .reviews-grid{grid-template-columns:1fr}
  .blog-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto}
  .social-grid{grid-template-columns:repeat(3,1fr)}
}

/* DRESS DETAIL */
.detail{padding:clamp(26px,4vw,44px) 0 clamp(56px,8vw,100px)}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,66px);align-items:start}
.gallery-main{position:relative;aspect-ratio:7/10;border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow);background:var(--champagne-soft);isolation:isolate}
.gallery-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}
.gallery-layer.on{opacity:1}
.gallery-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,246,246,.95);color:var(--rose);display:grid;place-items:center;font-size:1.3rem;box-shadow:var(--shadow-soft);transition:.3s;z-index:3}
.gallery-nav:hover{background:#fff}
.gallery-nav.prev{left:14px}.gallery-nav.next{right:14px}
.gallery-count{position:absolute;top:14px;right:14px;background:rgba(92,58,71,.55);color:#fff;font-size:.66rem;letter-spacing:.1em;padding:5px 11px;border-radius:999px;z-index:3}
.thumbs{display:flex;gap:12px;margin-top:14px}
.thumb{flex:1;border-radius:12px;overflow:hidden;border:2px solid transparent;opacity:.55;transition:.3s;background:var(--champagne-soft)}
.thumb img{width:100%;aspect-ratio:7/10;object-fit:cover}
.thumb:hover{opacity:.85}
.thumb.on{opacity:1;border-color:var(--rose)}
.detail-info{padding-top:6px}
.detail-info .tag{display:inline-block;background:var(--blush);color:var(--rose);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;padding:6px 13px;border-radius:999px}
.detail-info h1{font-size:clamp(2.6rem,5.4vw,4rem);margin:16px 0 6px;letter-spacing:-.01em}
.detail-info .style{font-size:.92rem;letter-spacing:.04em;color:var(--taupe-45)}
.detail-info .price{font-family:var(--serif);font-size:1.7rem;font-weight:600;color:var(--taupe);margin-top:18px}
.detail-info .price small{font-family:var(--sans);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--taupe-45);font-weight:600;margin-right:8px}
.detail-info .desc{color:var(--taupe-70);font-size:1.04rem;margin-top:20px;max-width:480px}
.detail-block{margin-top:28px}
.detail-block h4{font-family:var(--sans);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--taupe-45);font-weight:600;margin-bottom:14px}
.swatches{display:flex;gap:16px;flex-wrap:wrap}
.swatch{display:flex;flex-direction:column;align-items:center;gap:7px;cursor:pointer}
.swatch .dot{width:34px;height:34px;border-radius:50%;border:1px solid rgba(0,0,0,.08);box-shadow:inset 0 -3px 8px rgba(0,0,0,.12);transition:.25s}
.swatch.on .dot{outline:2px solid var(--rose);outline-offset:3px}
.swatch span{font-size:.6rem;letter-spacing:.06em;color:var(--taupe-70);text-transform:uppercase}
.swatch.on span{color:var(--rose);font-weight:600}
.detail-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px;align-items:center}
.detail-note{display:flex;gap:12px;align-items:flex-start;margin-top:26px;padding:16px 18px;background:var(--blush);border-radius:14px;font-size:.86rem;color:var(--taupe);max-width:500px}
.detail-note .tick{flex:none;width:24px;height:24px;border-radius:50%;background:#fff;color:var(--rose);display:grid;place-items:center;margin-top:1px}
.detail-note .tick svg{width:12px;height:12px}
.detail-spec{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-top:26px;border-top:1px solid var(--line)}
.detail-spec div{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.88rem}
.detail-spec dt{color:var(--taupe-45);letter-spacing:.04em}
.detail-spec dd{color:var(--taupe);font-weight:500;text-align:right}
.more-strip{padding:clamp(48px,7vw,90px) 0;background:linear-gradient(180deg,var(--ivory),var(--champagne-soft) 130%)}

/* HOW IT WORKS */
.how{padding:clamp(58px,8vw,108px) 0;background:linear-gradient(180deg,var(--ivory),var(--champagne-soft) 120%)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.step{text-align:center;padding:0 6px}
.step .num{font-family:var(--serif);font-size:2.7rem;font-weight:500;color:var(--rose);line-height:1}
.step .num::after{content:"";display:block;width:30px;height:1px;background:var(--line);margin:16px auto 18px}
.step h3{font-size:1.42rem;font-weight:600;margin-bottom:8px}
.step p{color:var(--taupe-70);font-size:.94rem;max-width:300px;margin:0 auto}

/* REVIEW */
.review{padding:clamp(60px,9vw,120px) 0;text-align:center;position:relative}
.review .stars{color:var(--rose);letter-spacing:.34em;font-size:1.05rem;margin-bottom:26px}
.review blockquote{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.7rem,4vw,2.9rem);line-height:1.32;max-width:880px;margin:0 auto;color:var(--taupe);letter-spacing:-.01em}
.review blockquote .q{color:var(--rose);font-style:normal}
.review cite{display:block;margin-top:30px;font-style:normal;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--taupe-45);font-weight:600}
.review cite b{color:var(--rose);font-weight:600}

/* CTA strip */
.cta-strip{background:var(--rose);color:var(--blush);text-align:center;padding:clamp(50px,7vw,88px) 0;position:relative;overflow:hidden}
.cta-strip h2{color:#fff;font-size:clamp(2rem,4.6vw,3.2rem);margin-bottom:14px}
.cta-strip p{color:rgba(255,246,246,.85);max-width:460px;margin:0 auto 30px;font-size:1.02rem}
.cta-strip .btn-primary{background:#fff;color:var(--rose);box-shadow:0 16px 34px -16px rgba(0,0,0,.4)}
.cta-strip .btn-primary:hover{background:var(--ivory);color:var(--rose-deep)}

/* FOOTER */
footer{background:var(--taupe);color:rgba(255,246,246,.78);padding:clamp(48px,6vw,76px) 0 28px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.4fr;gap:34px}
/* 17 Aug 2026: a fifth column (Nearby) was added for the location pages. */
.foot-brand .name{font-family:var(--serif);font-size:1.55rem;color:#fff;font-weight:600}
.foot-brand .strap{font-size:.56rem;letter-spacing:.42em;text-transform:uppercase;color:var(--blush);margin-top:4px}
.foot-brand p{font-size:.86rem;margin-top:16px;max-width:280px;color:rgba(255,246,246,.6)}
.foot-col h4{font-family:var(--sans);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--blush);font-weight:600;margin-bottom:16px}
.foot-col a,.foot-col p{display:block;font-size:.9rem;color:rgba(255,246,246,.72);margin-bottom:10px;transition:color .3s}
.foot-col a:hover{color:#fff}
.foot-col a[href^="mailto:"]{overflow-wrap:anywhere;word-break:break-word}
.news{display:flex;gap:8px;margin-top:14px;max-width:300px}
.news input{flex:1;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;border-radius:999px;padding:.7em 1.1em;font-family:inherit;font-size:.85rem}
.news input::placeholder{color:rgba(255,246,246,.5)}
.news input:focus{outline:none;border-color:var(--blush)}
.news button{background:var(--blush);color:var(--taupe);border-radius:999px;padding:.7em 1.2em;font-weight:600;font-size:.8rem;transition:.3s}
.news button:hover{background:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:42px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.76rem;color:rgba(255,246,246,.5);letter-spacing:.03em}
.foot-bottom .social{display:flex;gap:18px}
.foot-bottom .social a:hover{color:var(--blush)}

/* Reveal animation, visible by default; JS hides only below-fold items, then animates them in */
.reveal{opacity:1;transform:none}
.reveal.pre{opacity:0;transform:translateY(26px);transition:none}
.reveal.in{opacity:1;transform:none;transition:opacity 1s cubic-bezier(.2,.7,.3,1),transform 1s cubic-bezier(.2,.7,.3,1)}
.reveal.in.d1{transition-delay:.08s}.reveal.in.d2{transition-delay:.16s}.reveal.in.d3{transition-delay:.24s}.reveal.in.d4{transition-delay:.32s}

/* MODAL */
.modal-bg{position:fixed;inset:0;z-index:120;background:rgba(70,42,52,.5);backdrop-filter:blur(5px);opacity:0;visibility:hidden;transition:.4s;display:grid;place-items:center;padding:20px}
.modal-bg.open{opacity:1;visibility:visible}
.modal{background:var(--ivory);width:100%;max-width:480px;border-radius:22px;box-shadow:var(--shadow);overflow:hidden;transform:translateY(20px) scale(.98);transition:.5s cubic-bezier(.2,.7,.3,1);max-height:92vh;overflow-y:auto}
.modal-bg.open .modal{transform:none}
.modal-top{background:linear-gradient(135deg,var(--blush),var(--champagne-soft));padding:26px 30px 22px;text-align:center;position:relative;border-bottom:1px solid var(--line)}
.modal-top .eyebrow{margin-bottom:8px;display:block}
.modal-top h3{font-size:1.85rem;font-weight:600}
.modal-top p{font-size:.84rem;color:var(--taupe-70);margin-top:5px}
.modal-close{position:absolute;top:14px;right:16px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.7);display:grid;place-items:center;color:var(--taupe);font-size:1.2rem;line-height:1;transition:.3s}
.modal-close:hover{background:#fff;color:var(--rose)}

.choose{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:24px 30px 8px}
.choose-card{position:relative;text-align:left;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 18px 18px;display:flex;flex-direction:column;gap:8px;transition:.35s cubic-bezier(.2,.7,.3,1)}
.choose-card:hover{border-color:var(--rose);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.choose-card .cc-icon{width:40px;height:40px;border-radius:50%;background:var(--blush);color:var(--rose);display:grid;place-items:center}
.choose-card .cc-icon svg{width:20px;height:20px}
.choose-card h4{font-family:var(--serif);font-size:1.4rem;font-weight:600;line-height:1.05}
.choose-card p{font-size:.84rem;color:var(--taupe-70);line-height:1.55;flex:1}
.choose-card .cc-meta{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--rose);font-weight:600}
.choose-card .cc-go{font-size:.78rem;font-weight:600;color:var(--rose);display:inline-flex;align-items:center;gap:6px;margin-top:4px}
.choose-card.feature{background:linear-gradient(160deg,var(--blush),var(--champagne-soft));border-color:transparent}
.cc-badge{position:absolute;top:14px;right:14px;background:var(--rose);color:#fff;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:4px 9px;border-radius:999px}

/* ===== Virtual AI try-on ===== */
.tryon{max-width:560px}
.to-dress{display:flex;gap:14px;align-items:center;background:var(--champagne-soft);border-radius:14px;padding:12px;margin-bottom:18px}
.to-dress img{width:56px;height:74px;object-fit:cover;border-radius:9px;flex:none}
.to-dress .td-info{flex:1;min-width:0}
.to-dress .td-info b{font-family:var(--serif);font-size:1.2rem;font-weight:600;display:block}
.to-dress .td-info span{font-size:.78rem;color:var(--taupe-45)}
.to-dress select{font-family:inherit;font-size:.86rem;color:var(--taupe);background:#fff;border:1px solid var(--line);border-radius:9px;padding:.5em .7em;margin-top:6px;max-width:160px}
.upload-zone{border:1.5px dashed var(--line);border-radius:16px;padding:30px 20px;text-align:center;transition:.3s;cursor:pointer;background:#fff}
.upload-zone:hover,.upload-zone.drag{border-color:var(--rose);background:var(--blush)}
.upload-zone .uz-ic{width:48px;height:48px;border-radius:50%;background:var(--blush);color:var(--rose);display:grid;place-items:center;margin:0 auto 12px}
.upload-zone .uz-ic svg{width:22px;height:22px}
.upload-zone h4{font-family:var(--sans);font-size:.96rem;font-weight:600;color:var(--taupe);margin-bottom:4px}
.upload-zone p{font-size:.8rem;color:var(--taupe-45)}
.upload-actions{display:flex;gap:10px;margin-top:12px;justify-content:center;flex-wrap:wrap}
.upload-actions .btn{font-size:.78rem;padding:.66em 1.3em}
.uz-preview{display:none;align-items:center;gap:13px;background:var(--champagne-soft);border-radius:13px;padding:11px;margin-top:14px}
.uz-preview.show{display:flex}
.uz-preview img{width:50px;height:62px;object-fit:cover;border-radius:8px}
.uz-preview .upx{margin-left:auto;font-size:.76rem;color:var(--rose);font-weight:600;background:none}
.privacy{display:flex;gap:9px;align-items:flex-start;font-size:.73rem;color:var(--taupe-45);line-height:1.5;margin-top:14px}
.privacy svg{width:15px;height:15px;color:var(--rose);flex:none;margin-top:1px}
.to-body{padding:24px 30px 30px}
.to-loading{padding:60px 30px;text-align:center}
.to-spin{width:54px;height:54px;margin:0 auto 22px;border-radius:50%;border:3px solid var(--blush);border-top-color:var(--rose);animation:tospin 1s linear infinite}
@keyframes tospin{to{transform:rotate(360deg)}}
.to-loading h3{font-size:1.7rem;font-weight:600;margin-bottom:6px}
.to-loading p{font-size:.88rem;color:var(--taupe-70)}
.ai-frame{position:relative;border-radius:var(--arch);overflow:hidden;box-shadow:var(--shadow);background:var(--champagne-soft);isolation:isolate;aspect-ratio:7/9}
.ai-frame img{width:100%;height:100%;object-fit:cover}
.ai-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(125deg,rgba(184,92,122,.16),transparent 45%,rgba(255,255,255,.22));mix-blend-mode:screen;pointer-events:none}
.ai-shimmer{position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-100%);animation:aishine 3.4s ease-in-out infinite;pointer-events:none}
@keyframes aishine{0%,60%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.ai-tag{position:absolute;top:12px;left:12px;z-index:2;background:rgba(255,246,246,.96);color:var(--rose);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:6px 11px;border-radius:999px;display:flex;align-items:center;gap:6px}
.ai-tag svg{width:12px;height:12px}
.to-userthumb{position:absolute;right:12px;bottom:12px;z-index:2;width:52px;height:52px;border-radius:10px;overflow:hidden;border:2px solid rgba(255,255,255,.85);box-shadow:var(--shadow-soft)}
.to-userthumb img{width:100%;height:100%;object-fit:cover}
.to-result h3{font-size:1.5rem;font-weight:600;text-align:center;margin:18px 0 4px}
.to-result .cap{text-align:center;font-size:.86rem;color:var(--taupe-70);margin-bottom:18px}
.to-result .cap b{color:var(--rose);font-weight:600}
.to-row{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;margin-bottom:14px}
.to-row label{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--taupe-45);font-weight:600}
.to-row select{font-family:inherit;font-size:.86rem;color:var(--taupe);background:#fff;border:1px solid var(--line);border-radius:9px;padding:.5em .8em}
.to-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.to-actions .btn{font-size:.8rem;padding:.8em 1em;width:100%}
.to-actions .full{grid-column:1 / -1}
.to-mini{display:flex;gap:14px;justify-content:center;margin-top:12px}
.to-mini button{font-size:.76rem;font-weight:600;color:var(--rose);display:inline-flex;align-items:center;gap:6px}
.to-mini svg{width:14px;height:14px}

/* Dress detail: dual CTA */
.detail-cta .btn{flex:1;min-width:170px}
.btn-ai{background:var(--taupe);color:var(--ivory)}
.btn-ai:hover{background:var(--rose-deep);color:#fff;transform:translateY(-2px)}
.btn-ai svg{width:15px;height:15px}
.detail-back-link{display:block;margin-top:14px;font-size:.8rem;font-weight:600;color:var(--rose)}

@media(max-width:560px){
  .choose{grid-template-columns:1fr}
}

/* Toast */
.toast{position:fixed;bottom:26px;left:50%;translate:-50% 40px;background:var(--taupe);color:var(--ivory);padding:13px 24px;border-radius:999px;font-size:.85rem;z-index:140;opacity:0;visibility:hidden;transition:.4s;box-shadow:var(--shadow)}
.toast.show{opacity:1;visibility:visible;translate:-50% 0}

/* Background-wash toggle (Tweaks) */
html[data-washes="off"] .hero::before{background:var(--ivory)}
html[data-washes="off"] .promise{background:var(--champagne-soft)}
html[data-washes="off"] .how{background:var(--champagne-soft)}
html[data-washes="off"] .promise::before,html[data-washes="off"] .promise::after{display:none}

/* Responsive */
@media(max-width:980px){
  .gowns{grid-template-columns:repeat(2,1fr);gap:22px}
  .gowns.grid-3{grid-template-columns:repeat(2,1fr)}
  .hero-grid{grid-template-columns:1fr;gap:38px}
  .hero-copy{max-width:none;text-align:center;margin:0 auto}
  .hero p.lede{margin:0 auto}.hero-cta,.hero-meta{justify-content:center}
  .hero-frame img{height:clamp(440px,82vw,560px)}
  .promise-grid{grid-template-columns:1fr;gap:32px}
  .promise-art{order:-1;max-width:440px;margin:0 auto}
  .detail-grid{grid-template-columns:1fr;gap:30px}
  .gallery-main{max-width:460px;margin:0 auto}
  .foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .foot-brand,.foot-news{grid-column:span 2}
}
@media(max-width:680px){
  .nav-links{display:none}
  .nav-inner{grid-template-columns:auto 1fr auto;padding:13px 18px}
  .brand{grid-column:2;text-align:left;padding-left:6px}
  .nav-right{grid-column:3}
  .nav-right .nav-book{display:none}
  .burger{display:flex}
  .steps{grid-template-columns:1fr;gap:34px}
  .step .num::after{margin:12px auto 14px}
  .foot-grid{grid-template-columns:1fr}
  .foot-brand,.foot-news{grid-column:auto}
  .hero-badge{left:50%;transform:translateX(-50%);bottom:-20px}
  .filter-primary{grid-template-columns:1fr}
  .filter-secondary{grid-template-columns:1fr}
  .detail-spec{grid-template-columns:1fr}
}
@media(max-width:420px){
  .gowns,.gowns.grid-3{grid-template-columns:1fr;gap:26px;max-width:340px;margin:0 auto}
}
/* 8 Sep 2026: this at-rule had lost its block, which meant the parser swallowed
   the first .built-by rule below it and reduced-motion was never honoured.
   Restored with the declarations it was always meant to carry. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal.pre,.reveal.in{opacity:1;transform:none;transition:none}
  .btn:hover,.pd-thumb:hover{transform:none}
  .bq-fig img{transition:none}
  .bq-fig:hover img{transform:none}
}

/* Built by Mensia badge */
.built-by{margin-top:30px;text-align:center}
.built-by a{display:inline-flex;align-items:baseline;gap:.55em;font-size:.6rem;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,246,246,.38);transition:color .3s}
.built-by a span{font-family:var(--serif);font-weight:500;text-transform:none;letter-spacing:.02em;font-size:1.05rem;color:#e7cfad;transition:color .3s}
.built-by a:hover{color:rgba(255,246,246,.6)}
.built-by a:hover span{color:var(--blush)}

/* ==========================================================================
   Prerendered pages (gown/*.html, journal/*.html, location + info pages)
   Added 17 Aug 2026 alongside build/prerender.mjs.
   These pages carry no catalogue JavaScript, so everything here is static.
   ========================================================================== */

.wrap-narrow{max-width:820px}

/* --- gown detail --- */
.pd-hero{border-radius:var(--arch);overflow:hidden;background:var(--champagne-soft);box-shadow:var(--shadow-soft)}
.pd-hero img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}
.pd-thumbs{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.pd-thumb{width:78px;border-radius:10px;overflow:hidden;border:2px solid transparent;padding:0;background:var(--champagne-soft);transition:border-color .3s,transform .3s}
.pd-thumb img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}
.pd-thumb.on{border-color:var(--rose)}
.pd-thumb:hover{transform:translateY(-2px)}
.pd-h4{font-size:1.02rem;margin-bottom:10px}
.pd-swatches{display:flex;flex-wrap:wrap;gap:14px}
.pd-swatch{display:inline-flex;align-items:center;gap:.55em;font-size:.82rem;color:var(--taupe-70)}
.pd-swatch i{width:20px;height:20px;border-radius:50%;border:1px solid var(--line);display:inline-block}
.pd-visit{margin-top:26px;padding-top:20px;border-top:1px solid var(--line);font-size:.86rem;line-height:1.8;color:var(--taupe-70)}
.pd-visit a{color:var(--rose);text-decoration:underline;text-underline-offset:3px}

/* --- related cards, shared by gowns and journal --- */
.pd-more{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pd-more-card{display:block;border-radius:14px;overflow:hidden;background:#fff;box-shadow:var(--shadow-soft);transition:transform .4s,box-shadow .4s;padding-bottom:16px}
.pd-more-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.pd-more-card img{width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}
.pd-more-name{display:block;font-family:var(--serif);font-size:1.08rem;padding:14px 16px 0;color:var(--taupe)}
.pd-more-style{display:block;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);padding:4px 16px 0}

/* --- journal article --- */
.post{padding:clamp(40px,7vw,80px) 0}
.post h1{font-size:clamp(2rem,4.6vw,3.1rem);margin-bottom:14px}
.post-meta{font-size:.78rem;letter-spacing:.06em;color:var(--taupe-45);margin-bottom:26px}
.post-excerpt{font-size:1.14rem;line-height:1.75;color:var(--taupe-70);font-style:italic;margin-bottom:28px}
.post-hero{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:16px;margin-bottom:36px;box-shadow:var(--shadow-soft)}
.post-body{font-size:1.02rem;line-height:1.9}
.post-body h2{font-size:clamp(1.5rem,3vw,2rem);margin:44px 0 14px}
.post-body h3{font-size:1.24rem;margin:32px 0 10px}
.post-body h4{font-size:1.06rem;margin:26px 0 8px}
.post-body p{margin-bottom:20px}
.post-body ul,.post-body ol{margin:0 0 22px 1.3em}
.post-body li{margin-bottom:9px}
.post-body strong{font-weight:600;color:var(--taupe)}
.post-body a{color:var(--rose);text-decoration:underline;text-underline-offset:3px}
.post-cta{margin-top:52px;padding:34px;border-radius:16px;background:var(--champagne-soft);text-align:center}
.post-cta h2{margin-bottom:10px}
.post-cta p{margin-bottom:20px;color:var(--taupe-70)}

/* --- crawlable index lists on /collection and /blog ---
   Visible to everyone: a plain, fast route to every page. Deliberately not
   display:none — hidden links are worth nothing to a crawler. */
.static-index{margin-top:56px;padding-top:34px;border-top:1px solid var(--line)}
.static-index h2{font-size:1.34rem;margin-bottom:8px}
.static-index>p{font-size:.86rem;color:var(--taupe-45);margin-bottom:18px;max-width:60ch}
.static-index ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:2px 26px}
.static-index li{padding:7px 0;border-bottom:1px solid rgba(184,92,122,.1);font-size:.9rem}
.static-index li a{color:var(--taupe);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)}
.static-index li a:hover{color:var(--rose)}
.static-index li span{color:var(--taupe-45);font-size:.76rem;margin-left:.5em}

/* --- location + info pages --- */
.info-body{padding:clamp(36px,6vw,70px) 0}
.info-body h2{font-size:clamp(1.5rem,3vw,2.1rem);margin:40px 0 14px}
.info-body h2:first-child{margin-top:0}
.info-body h3{font-size:1.18rem;margin:26px 0 8px}
.info-body p{margin-bottom:18px;line-height:1.9}
.info-body ul{margin:0 0 22px 1.3em}
.info-body li{margin-bottom:9px;line-height:1.8}
.info-cols{display:grid;grid-template-columns:1fr 1fr;gap:38px;margin:34px 0}
.info-card{padding:26px;border-radius:14px;background:var(--champagne-soft)}
.info-card h3{margin-top:0}
.info-card p:last-child{margin-bottom:0}
.faq-item{padding:20px 0;border-bottom:1px solid var(--line)}
.faq-item h3{margin:0 0 8px}
.faq-item p{margin:0;color:var(--taupe-70)}

/* --- 404 --- */
.nf{min-height:62vh;display:flex;align-items:center;text-align:center}
.nf h1{font-size:clamp(2.4rem,6vw,4rem);margin-bottom:12px}
.nf p{color:var(--taupe-70);margin-bottom:26px}
.nf .btn{margin:0 6px 10px}

@media(max-width:860px){
  .pd-more{grid-template-columns:repeat(2,1fr)}
  .info-cols{grid-template-columns:1fr;gap:24px}
}
@media(max-width:560px){
  .pd-more{grid-template-columns:1fr}
  .static-index ul{grid-template-columns:1fr}
}

/* ==========================================================================
   Inside the boutique — shop-floor photography
   Added 8 Sep 2026. Real photographs of the Cleveleys rails, supplied by the
   boutique. Used on the homepage (feature + staggered trio), the About page
   and once per location page.

   Every image carries width/height and an aspect-ratio so nothing reflows as
   the photographs decode — these sit below the fold and are lazy-loaded, and
   a late-arriving 1200px WebP with no reserved box is a CLS penalty.
   ========================================================================== */

.boutique{padding:clamp(58px,8vw,108px) 0;background:linear-gradient(180deg,var(--champagne-soft),var(--blush))}

/* --- the wide anchor shot --- */
.bq-feature{position:relative;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);background:var(--champagne-soft)}
.bq-feature img{width:100%;height:auto;aspect-ratio:4/3;max-height:clamp(340px,46vw,560px);object-fit:cover;object-position:center 58%}
.bq-feature figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:clamp(26px,5vw,40px) clamp(22px,4vw,38px) clamp(20px,3vw,30px);
  background:linear-gradient(180deg,rgba(92,58,71,0),rgba(92,58,71,.78));color:#fff;
  font-family:var(--serif);font-size:clamp(1.15rem,2.3vw,1.62rem);line-height:1.35;letter-spacing:-.005em;
}
.bq-feature figcaption span{
  display:block;font-family:var(--sans);font-weight:600;font-size:.62rem;letter-spacing:.3em;
  text-transform:uppercase;color:var(--blush);margin-bottom:.6em;opacity:.92;
}

/* --- the staggered trio --- */
.bq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px);margin-top:clamp(20px,3vw,34px)}
.bq-fig{margin:0}
.bq-fig .f{border-radius:14px;overflow:hidden;background:var(--champagne-soft);box-shadow:var(--shadow-soft)}
.bq-fig img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.bq-fig:hover img{transform:scale(1.035)}
.bq-fig figcaption{
  margin-top:12px;font-size:.78rem;line-height:1.6;color:var(--taupe-70);
  padding-left:14px;border-left:1px solid var(--line);
}
/* The middle column drops, so the row reads as a considered edit rather than
   three boxes in a row. Only worth doing where there is room for it. */
.bq-grid .bq-fig:nth-child(2){margin-top:clamp(22px,4vw,54px)}

/* --- single image, for location and info pages --- */
.bq-single{margin:clamp(30px,5vw,46px) 0}
.bq-single .f{border-radius:14px;overflow:hidden;background:var(--champagne-soft);box-shadow:var(--shadow-soft)}
/* A wide band rather than the source ratio: these run inside .wrap-narrow, and
   a full-height portrait would shove the copy off the screen. The rails are
   vertically repeating, so a horizontal slice still reads as a rail of dresses. */
.bq-single img{width:100%;height:auto;aspect-ratio:16/10;max-height:420px;object-fit:cover;object-position:center 50%}
.bq-single figcaption{margin-top:12px;font-size:.82rem;color:var(--taupe-70);padding-left:14px;border-left:1px solid var(--line)}

/* Landscape source in the arched .promise-art box: the default 22% focal point
   was set for full-length model shots and would frame the ceiling here. */
.promise-art.bq-art img{object-position:center 58%}

/* 8 Sep 2026 — bug fix, spotted while adding the photography above.
   prom-dresses-cleveleys.html writes <li class="tick">, putting the class on
   the list item itself rather than on a child <span> the way index.html does.
   That handed every <li> the 26px circle rule, so all five town names collapsed
   into 26px boxes and printed on top of one another. Scoping the circle would
   mean touching every page that uses the span form, so instead a bare li.tick
   undoes the circle and draws its own marker. */
.promise-points li.tick{
  display:flex;align-items:flex-start;gap:14px;
  width:auto;height:auto;border-radius:0;background:none;box-shadow:none;
  color:var(--taupe);font-size:.96rem;
}
.promise-points li.tick::before{
  content:"";flex:none;width:26px;height:26px;margin-top:1px;border-radius:50%;
  background:#fff no-repeat center/13px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B85C7A' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  box-shadow:var(--shadow-soft);
}

/* --- About page: a portrait pair --- */
.bq-pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,26px);margin:clamp(30px,5vw,46px) 0}
.bq-pair .f{border-radius:14px;overflow:hidden;background:var(--champagne-soft);box-shadow:var(--shadow-soft)}
.bq-pair img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}

@media(max-width:860px){
  .bq-grid{grid-template-columns:repeat(2,1fr)}
  /* Three into two columns leaves an orphan, so the third runs wide and the
     stagger is dropped — it only makes sense across an odd number of columns. */
  .bq-grid .bq-fig:nth-child(2){margin-top:0}
  .bq-grid .bq-fig:nth-child(3){grid-column:span 2}
  .bq-grid .bq-fig:nth-child(3) img{aspect-ratio:16/10}
}
@media(max-width:560px){
  .bq-grid{grid-template-columns:1fr;gap:26px}
  .bq-grid .bq-fig:nth-child(3){grid-column:auto}
  .bq-grid .bq-fig:nth-child(3) img{aspect-ratio:3/4}
  .bq-pair{grid-template-columns:1fr;gap:20px}
  .bq-feature img{aspect-ratio:1/1}
  /* The caption wraps to two lines at this width and the square crop puts pale
     tulle behind it, so the scrim has to start higher and run darker. */
  .bq-feature figcaption{
    padding:56px 20px 18px;
    background:linear-gradient(180deg,rgba(92,58,71,0),rgba(92,58,71,.55) 38%,rgba(92,58,71,.88));
  }
}