/* Coffee Meets Bagel – V3: photo-backed editorial theme.
   Restrained photography sits behind every purple and cream surface. */
:root { --plum:#27102c; --deep:#160916; --gold:#d8a456; --gold-light:#ecc579; --cream:#f6eee3; --ivory:#fff8ef; --ink:#2d1925; }
body { overflow-x:hidden; }
.site-header {height:100px;background:linear-gradient(90deg,#2a112b,#1e0c22 51%,#29112c);box-shadow:0 14px 26px #0e041245;z-index:60;}
.header-inner {grid-template-columns:minmax(0,1fr) 142px minmax(0,1fr);width:min(1500px,calc(100% - 40px));}
.center-brand {height:100px;}
.center-brand img {width:114px;height:96px;object-fit:contain;filter:drop-shadow(0 1px 2px #0004);}
.navigation a {font-size:11px;letter-spacing:.14em;} .nav-left{justify-content:flex-start}.nav-right{justify-content:flex-end;padding-right:76px}.navigation{gap:clamp(28px,2.8vw,54px)}
.header-tools {right:0;}
.header-tools svg {display:block;}

/* Hero: product photography blends into an atmospheric, purple-wide canvas. */
.hero-v3 {position:relative;min-height:625px;background:#210c25 url('assets/subtle-purple-beans.webp') center/cover no-repeat;isolation:isolate;}
.hero-v3:after {content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(90deg,rgba(29,8,31,.95) 0%,rgba(36,13,40,.90) 21%,rgba(38,13,39,.42) 46%,rgba(28,7,28,.03) 77%),linear-gradient(0deg,rgba(17,7,18,.48),transparent 27%);}
.hero-v3 .hero-content {position:static;min-height:625px;display:flex;align-items:center;}
.hero-v3 .hero-copy {position:relative;z-index:3;width:52%;padding:46px 0 90px;}
.hero-v3 .hero-copy .eyebrow {font-size:11px;color:#f4dfc9;letter-spacing:.3em;white-space:normal;}
.hero-v3 .hero-copy h1 {font-size:clamp(62px,6.3vw,98px);line-height:1.07;letter-spacing:-.055em;margin:32px 0 20px;max-width:700px;text-shadow:0 3px 25px #1b09284d;}
.hero-v3 .hero-copy h1 em {color:#e6b868;}
.hero-v3 .hero-copy p {font-size:17px;color:#f6eadd;margin:0;max-width:565px;letter-spacing:.01em;}
.hero-v3 .hero-copy .actions {margin-top:35px;}
.hero-v3 .btn-gold {background:linear-gradient(125deg,#f0cb83,#cc963f);box-shadow:0 10px 25px #11041455;min-width:236px;}
.hero-v3 .hero-visual {position:absolute;z-index:0;inset:0 0 0 auto;width:75%;height:100%;border-radius:0;box-shadow:none;pointer-events:none;overflow:hidden;}
.hero-v3 .hero-visual:before {display:none;}
.hero-v3 .hero-visual img {width:100%;height:100%;object-fit:cover;object-position:center center;filter:saturate(1.07) contrast(1.04);}
.hero-v3 .hero-scroll {position:absolute;left:50%;bottom:18px;z-index:4;transform:translateX(-50%);text-align:center;color:#fff4e7;font-size:9px;letter-spacing:.24em;font-weight:700;text-shadow:0 2px 12px #150518;white-space:nowrap;}
.hero-scroll span {display:block;font-size:20px;line-height:24px;font-weight:400;}

/* Same photographic texture family extends into every cream section. */
.photo-cream {background-color:#f7eee1;background-repeat:no-repeat;background-size:cover;background-position:center;}
.photo-purple {background-color:#28102b;background-repeat:no-repeat;background-size:cover;background-position:center;}
.category-section {background-image:linear-gradient(90deg,rgba(251,245,235,.32),rgba(251,245,235,.10)),url('assets/subtle-cream-bagel.webp');border-bottom:1px solid #dcc9b6;}
.category-links {min-height:148px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:stretch;}
.category-link {display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;position:relative;color:#411f27;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.18em;transition:transform .2s,background .2s;}
.category-link:not(:last-child):after {content:"";height:58px;width:1px;position:absolute;right:0;top:50%;transform:translateY(-50%);background:#cda97b72;}
.category-link:hover,.category-link:focus-visible {background:rgba(255,255,255,.3);transform:translateY(-2px);}
.category-art svg {width:43px;height:43px;stroke:#5c3431;transition:stroke .2s;}
.category-link:hover .category-art svg {stroke:#b77f37;}

/* V3's editorial three-column composition mimics the approved concept, without repeating huge image collages. */
.showcase-section {background-image:linear-gradient(90deg,rgba(250,243,233,.2),rgba(250,243,233,.35)),url('assets/subtle-cream-cafe.webp');color:#321f25;padding:54px 0 70px;}
.showcase-grid {display:grid;grid-template-columns:.9fr 1.5fr .93fr;gap:26px;align-items:stretch;}
.showcase-grid>article {min-width:0;position:relative;padding:9px 18px 10px 0;}
.showcase-grid>article + article {border-left:1px solid #b58f704a;padding-left:26px;}
.decor-line {height:3px;width:48px;background:#be8b49;margin:0 0 19px;}
.showcase-section h2 {font-family:var(--serif);font-size:clamp(28px,2.45vw,41px);font-weight:500;line-height:1.2;letter-spacing:-.035em;margin:0 0 27px;}
.showcase-section h2 em {color:#7d3f2f;font-style:italic;}
.story-panel {display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;}
.story-panel p {max-width:345px;font-family:var(--serif);font-size:18px;line-height:1.62;margin:5px 0 25px;color:#473434;position:relative;z-index:1;}
.thin-button {border:1px solid #bd853f;color:#321b24;display:inline-flex;gap:18px;align-items:center;padding:12px 15px;text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.09em;margin-top:auto;transition:background .2s,color .2s;}
.thin-button:hover {background:#451b3e;color:#fff7ee;}
.story-watermark {margin-top:38px;color:#a4826b;font-size:10px;letter-spacing:.25em;opacity:.54;}
.featured-panel .showcase-heading {display:flex;align-items:flex-start;justify-content:space-between;gap:6px;}
.featured-panel .tiny-view {font-size:10px;text-transform:uppercase;color:#7b4a30;font-weight:800;white-space:nowrap;padding-top:8px;}
.featured-v3 {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:start;}
.feature-card {text-align:center;min-width:0;}
.feature-img {border-radius:11px;overflow:hidden;background:#44242d;aspect-ratio:1;box-shadow:0 9px 25px #3e23172b;}
.feature-img img {width:100%;height:100%;object-fit:cover;transition:transform .35s;}
.feature-card:hover img {transform:scale(1.045);}
.feature-card h3 {font-family:var(--serif);font-style:italic;font-size:clamp(14px,1.2vw,19px);font-weight:600;line-height:1.25;margin:13px 0 5px;}
.feature-card p {font-size:8px;letter-spacing:.18em;font-weight:800;color:#80634e;margin:0 0 10px;}
.feature-card button {background:transparent;border:0;color:#8a5b2b;font-size:10px;font-weight:700;cursor:pointer;padding:6px;}
.feature-card button:hover {color:#331326;text-decoration:underline;}
.merch-teaser {text-align:center;display:flex;flex-direction:column;}
.merch-teaser .decor-line {margin-right:auto;}
.merch-teaser h2 {text-align:left;margin-bottom:10px;}
.teaser-products {flex:1;display:grid;place-items:center;min-height:170px;margin:0 -16px 0;}
.teaser-products img {width:100%;height:170px;object-fit:cover;object-position:center;border-radius:8px;}
.merch-teaser p {font-family:var(--serif);font-style:italic;font-size:17px;margin:8px 0 14px;}
.merch-teaser .thin-button {align-self:center;margin-top:0;}

.full-story-band {background-image:linear-gradient(100deg,rgba(41,15,42,.96),rgba(37,12,41,.94));padding:56px 0;border-top:1px solid #a77c5940;border-bottom:1px solid #a77c5940;}
.story-band-inner {display:grid;grid-template-columns:.92fr 1.35fr;align-items:stretch;gap:0;background:#2a102f;overflow:hidden;}
.story-band-copy{padding:56px 58px;display:flex;flex-direction:column;justify-content:center;min-width:0;background:linear-gradient(90deg,rgba(39,15,43,.94),rgba(39,15,43,.88));}
.story-band-inner h2 {font-family:var(--serif);font-size:clamp(32px,4.1vw,62px);font-weight:400;line-height:1.02;margin:10px 0 18px;}
.story-band-inner h2 em {color:#e6b66f;}
.story-band-copy p {font-size:14px;line-height:1.9;color:#ecdae7;max-width:420px;margin:0;}
.story-band-visual{min-height:280px;background:#1f121e;}
.story-band-visual img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;}

.menu-section {background-image:linear-gradient(110deg,rgba(30,9,33,.81),rgba(37,14,40,.87)),url('assets/subtle-purple-coffee.webp');background-color:#251129;background-size:cover;background-position:center;padding:89px 0 100px;}
.menu-list {background:#220d26b3;}
.menu-entry {background:rgba(34,13,39,.22);}
.menu-top p {color:#dccbda;}

.merch-section {background-image:linear-gradient(90deg,rgba(248,240,229,.65),rgba(246,234,222,.67)),url('assets/subtle-cream-merch.webp');background-position:center;background-size:cover;padding:95px 0 100px;}
.merch-banner {background:#321637 url('assets/subtle-purple-cafe.webp') center/cover no-repeat;min-height:330px;box-shadow:0 14px 32px #331a2424;}
.merch-banner-photo {background:#231329;}
.merch-banner-photo:after{content:none !important}.merch-banner-photo img{object-position:center center;}
.merch-heading {margin-top:76px;}
.merch-card {background:#fffbf5ef;box-shadow:0 9px 23px #4a2d1710;}
.merch-art {background:linear-gradient(145deg,#efe7dfb5,#e5d5c7b8);}

.rewards-section {min-height:340px;padding:78px 0 80px;background-image:linear-gradient(90deg,rgba(41,14,43,.83),rgba(41,14,43,.73)),url('assets/subtle-purple-beans.webp');background-color:#27102b;background-size:cover;background-position:center;}
.rewards-inner {display:flex;align-items:center;justify-content:center;text-align:center;}
.rewards-wide {max-width:850px;margin:auto;}
.rewards-wide h2 {font-size:clamp(40px,4vw,64px);margin:14px 0 17px;}
.rewards-wide p {margin:0 auto 25px;max-width:680px;color:#f2e2ec;font-size:15px;}
.rewards-wide .btn {min-width:210px;}
footer {background:#1d0b21 url('assets/subtle-purple-cafe.webp') center/cover no-repeat;border-top:1px solid #a67d4f4d;}
.footer-top,.footer-bottom {position:relative;}

@media (max-width:1180px){
 .header-inner {width:calc(100% - 42px);grid-template-columns:minmax(0,1fr) 128px minmax(0,1fr)}
 .navigation {gap:17px}.navigation a {font-size:9px;}
 .hero-v3 .hero-copy {width:58%;}.hero-v3 .hero-copy h1 {font-size:clamp(55px,6vw,82px);}
 .showcase-grid {grid-template-columns:1fr 1.55fr;gap:25px;}
 .showcase-grid>.merch-teaser {grid-column:1/-1;border-left:0;padding:25px 0 0;border-top:1px solid #b58f704a;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;text-align:left;gap:6px 30px;}
 .merch-teaser .decor-line {display:none;}.merch-teaser h2 {grid-column:1;}.merch-teaser p {grid-column:1;margin-top:-25px;}
 .merch-teaser .thin-button {grid-column:1;justify-self:start;}.teaser-products {grid-column:2;grid-row:1/4;min-height:150px;}
}
@media (max-width:850px){
 .site-header {height:83px}.center-brand {height:80px}.center-brand img {width:84px;height:80px}.header-inner {display:flex;justify-content:flex-end;}
 .hero-v3,.hero-v3 .hero-content {min-height:675px;}
 .hero-v3 .hero-content {display:block;position:relative;padding-top:0;}
 .hero-v3 .hero-copy {width:100%;padding-top:70px;position:relative;z-index:3;}
 .hero-v3 .hero-copy h1 {max-width:640px;font-size:clamp(57px,8vw,74px);}
 .hero-v3 .hero-visual {inset:auto 0 0 0;width:100%;height:68%;}
 .hero-v3:after {background:linear-gradient(180deg,#240b28 0%,rgba(39,13,41,.94) 24%,rgba(36,13,40,.40) 56%,rgba(25,10,26,.22) 100%);}
 .category-links {min-height:135px;}.category-link {font-size:9px;letter-spacing:.12em;}.category-art svg {width:35px;height:35px;}
 .showcase-grid {grid-template-columns:1fr 1.5fr;}
 .story-panel p {font-size:16px;}
 .featured-v3 {gap:7px;}.feature-card h3 {font-size:15px;}
 .story-band-inner {grid-template-columns:1fr;gap:0;} .story-band-copy{padding:34px 28px}.story-band-visual{min-height:210px}
}
@media (max-width:620px){
 .site-header {height:76px}.center-brand {height:75px;top:0;}.center-brand img {width:75px;height:74px;}
 .hero-v3,.hero-v3 .hero-content {min-height:682px;}
 .hero-v3 .hero-copy {padding:38px 0 0;}
 .hero-v3 .hero-copy .eyebrow {font-size:8px;letter-spacing:.18em;}
 .hero-v3 .hero-copy .eyebrow-stroke {width:20px;margin-right:3px;}
 .hero-v3 .hero-copy h1 {font-size:clamp(51px,13vw,71px);margin:21px 0 11px;}
 .hero-v3 .hero-copy p {font-size:13px;}
 .hero-v3 .hero-copy .actions {margin-top:19px;}
 .hero-v3 .hero-copy .btn {min-width:195px;padding:13px 18px;min-height:45px;}
 .hero-v3 .hero-visual {height:59%;width:110%;right:-5%;object-position:center;}
 .hero-v3 .hero-visual img {object-position:57% 50%;}
 .hero-v3:after {background:linear-gradient(180deg,#240b28 0%,rgba(39,13,41,.94) 26%,rgba(36,13,40,.20) 62%,rgba(25,10,26,.36) 100%);}
 .hero-v3 .hero-scroll {bottom:14px;font-size:8px;}
 .category-links {grid-template-columns:repeat(3,minmax(0,1fr));min-height:190px;}
 .category-link {min-height:94px;border-bottom:1px solid #bfa88d66;gap:4px;font-size:9px;letter-spacing:.07em;}
 .category-link:nth-child(3):after {display:none;}.category-link:nth-child(n+4){border-bottom:0;}
 .category-art svg {width:31px;height:31px;}
 .showcase-section {padding:45px 0 50px;}
 .showcase-grid {display:flex;flex-direction:column;gap:38px;}
 .showcase-grid>article {padding:0;}
 .showcase-grid>article+article {border-left:0;border-top:1px solid #b58f704a;padding:30px 0 0;}
 .showcase-section h2 {font-size:35px;margin-bottom:16px;}
 .story-panel p {max-width:100%;font-size:18px;margin-bottom:21px;}
 .featured-panel .tiny-view {font-size:9px;}
 .feature-card h3 {font-size:14px;}.feature-card p {font-size:7px;}.feature-card button {font-size:9px;}
 .showcase-grid>.merch-teaser {display:flex;flex-direction:column;align-items:stretch;text-align:center;gap:0;}
 .merch-teaser .decor-line {display:block;}.merch-teaser h2 {align-self:start;}
 .teaser-products {margin:0;}.teaser-products img {height:185px;object-fit:cover;}
 .merch-teaser p {margin:10px 0 18px;}.merch-teaser .thin-button {align-self:center;}
 .full-story-band {padding:45px 0;}.story-band-inner {display:block;}.story-band-copy{padding:32px 22px}.story-band-inner h2 {font-size:37px;margin-bottom:18px;}
 .story-band-copy p {font-size:13px;}.story-band-visual{height:210px;min-height:210px}
 .menu-section {padding:65px 0 75px;}.merch-section {padding:65px 0 85px;}
 .rewards-section {padding:68px 0;}.rewards-wide h2 {font-size:39px;}.rewards-wide p {font-size:13px;}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
/* Merge the hero photograph into the full canvas with no rectangular seam. */
@media(min-width:851px){.hero-v3 .hero-visual{width:100%;}.hero-v3 .hero-visual img{object-position:54% 49%;}}
@media(min-width:851px){
  .hero-v3 .hero-visual {left:auto;right:0;width:80%;margin:0;}
  .hero-v3 .hero-visual img {object-position:50% center;}
  .hero-v3 .hero-visual:after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#260d2a 0%,rgba(38,13,42,.95) 4%,rgba(38,13,42,.40) 21%,transparent 38%),linear-gradient(0deg,rgba(23,8,26,.27),transparent 19%);}
}
@media(max-width:850px){
  .hero-v3 .hero-visual {left:0;right:0;width:100%;margin:0;}
  .hero-v3 .hero-visual:after {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#270e2b 0%,rgba(39,14,43,.68) 6%,transparent 24%,transparent 88%,rgba(22,8,24,.31) 100%);}
}