.cafedet-page {
  --cafe-navy: #0d2f63;
  --cafe-blue: #174f9f;
  --cafe-cream: #f6f0e5;
  --cafe-paper: #fffdf8;
  --cafe-mint: #74dbc8;
  --cafe-coral: #f47d61;
  --cafe-ink: #12233f;
  --member-navy: #0d2f63;
  --member-blue: #174f9f;
  --member-coral: #f47d61;
  --member-cream: #f6f0e5;
  --member-paper: #fffdf8;
  color: var(--cafe-ink);
  background: var(--cafe-cream);
  overflow-x: hidden;
  overflow-y: visible;
}

.cafedet-page * { box-sizing: border-box; }
.cafedet-page a { text-decoration: none; }
.cafedet-page em { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.cafedet-page svg { display: block; }

.cafe-hero, .cafe-place, .cafe-menu, .cafe-join-block, .cafe-booking { min-height: calc(100svh - 72px); }

.cafe-hero {
  position: relative;
  min-height: calc(100svh - 72px);
  padding: clamp(68px, 7vw, 100px) 0 48px;
  color: white;
  background:
    radial-gradient(circle at 8% 94%, rgba(116, 219, 200, .2), transparent 25%),
    radial-gradient(circle at 92% 6%, rgba(244, 125, 97, .16), transparent 24%),
    var(--cafe-navy);
  isolation: isolate;
}

.cafe-grain {
  position: absolute;
  inset: 0;
  opacity: .13;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
  z-index: -1;
}

.cafe-hero-grid { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(440px, .96fr); gap: clamp(44px, 7vw, 112px); align-items: center; }
.cafe-eyebrow, .cafe-section-label { margin: 0 0 24px; font-size: 13px; line-height: 1; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.cafe-eyebrow { display: flex; align-items: center; gap: 14px; color: #c9e5ff; }
.cafe-eyebrow span { padding: 8px 11px; color: var(--cafe-navy); background: var(--cafe-mint); border-radius: 999px; letter-spacing: .12em; }
.cafe-hero h1 { margin: 0; max-width: 730px; font-size: clamp(66px, 7.4vw, 112px); line-height: .78; letter-spacing: -.075em; font-weight: 800; }
.cafe-hero h1 em { display: inline-block; color: var(--cafe-mint); font-size: .88em; letter-spacing: -.065em; transform: translateX(.06em); }
.cafe-hero-lead { max-width: 610px; margin: 40px 0 0; color: #dbe7f6; font-size: clamp(18px, 1.4vw, 23px); line-height: 1.5; }
.cafe-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.cafe-button { min-height: 58px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; font-size: 15px; font-weight: 800; transition: transform .25s ease, background .25s ease, color .25s ease; }
.cafe-button:hover { transform: translateY(-3px); }
.cafe-button svg, .cafe-place-info a svg { width: 22px; }
.cafe-button-primary { color: var(--cafe-navy); background: var(--cafe-mint); border-color: var(--cafe-mint); }
.cafe-button-light { color: white; background: transparent; }
.cafe-button-light:hover { color: var(--cafe-navy); background: white; }
.cafe-hero-facts { margin: 46px 0 0; padding: 24px 0 0; display: flex; flex-wrap: wrap; gap: 26px; border-top: 1px solid rgba(255,255,255,.2); list-style: none; }
.cafe-hero-facts li { display: flex; gap: 9px; color: #d4e2f3; font-size: 13px; font-weight: 700; }
.cafe-hero-facts span { color: var(--cafe-mint); }

.cafe-visual { position: relative; min-height:clamp(440px,64svh,550px); padding: 30px; color: var(--cafe-navy); background: var(--cafe-coral); border-radius: 12px 72px 12px 72px; box-shadow: 26px 28px 0 rgba(1, 20, 50, .32); transform: rotate(1.3deg); }
.cafe-visual::before { content: ''; position: absolute; inset: 14px; border: 1px solid rgba(13,47,99,.45); border-radius: 8px 58px 8px 58px; pointer-events: none; }
.cafe-visual-top, .cafe-visual-bottom { position: relative; z-index: 2; display: flex; justify-content: space-between; gap: 18px; font-size: 11px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.cafe-visual-word { position: relative; z-index: 1; margin: 58px 0 0; color: white; font-size: clamp(52px, 5vw, 79px); line-height: .82; font-weight: 900; letter-spacing: -.085em; white-space: nowrap; }
.cafe-visual-word strong { color: inherit; font: inherit; }
.cafe-cup { position: absolute; right: 45px; bottom: 102px; width: 154px; height: 154px; padding: 26px; display: grid; place-items: center; color: var(--cafe-navy); background: var(--cafe-cream); border-radius: 50%; transform: rotate(-8deg); }
.cafe-cup svg { width: 100%; }
.cafe-sticker { position: absolute; z-index: 3; min-width: 88px; min-height: 88px; padding: 12px; display: grid; place-items: center; color: var(--cafe-navy); background: var(--cafe-mint); border: 2px solid var(--cafe-navy); border-radius: 50%; font: italic 700 18px/1 Georgia, serif; box-shadow: 7px 8px 0 var(--cafe-navy); }
.cafe-sticker-one { top: 245px; right: -30px; transform: rotate(10deg); }
.cafe-sticker-two { bottom: 74px; left: -30px; background: var(--cafe-paper); transform: rotate(-9deg); }
.cafe-sticker-three { top: 327px; left: 45px; color: white; background: var(--cafe-blue); transform: rotate(7deg); }
.cafe-visual-bottom { position: absolute; right: 30px; bottom: 28px; left: 30px; align-items: end; }
.cafe-visual-bottom strong { max-width: 190px; font-size: 15px; letter-spacing: 0; text-transform: none; text-align: right; }

.cafe-local-nav { color: var(--cafe-navy); background: var(--cafe-paper); border-bottom: 1px solid #d8d1c6; }
.cafe-local-nav .container { min-height: 88px; display: grid; grid-template-columns: repeat(3, 1fr); }
.cafe-local-nav a { padding: 0 20px; display: flex; align-items: center; justify-content: center; gap: 13px; color: inherit; border-left: 1px solid #ded8cf; font-size: 15px; font-weight: 800; transition: color .2s ease, background .2s ease; }
.cafe-local-nav a:last-child { border-right: 1px solid #ded8cf; }
.cafe-local-nav a:hover { color: white; background: var(--cafe-blue); }
.cafe-local-nav span { font-size: 10px; opacity: .55; }

.cafe-place { padding-top: clamp(32px, 4vw, 56px); padding-bottom: clamp(32px, 4vw, 56px); display:flex; flex-direction:column; justify-content:center; scroll-margin-top: 100px; }
.cafe-section-intro { display: grid; grid-template-columns: minmax(150px, .35fr) 1.65fr; gap: 48px; align-items: start; margin-bottom: clamp(28px,3vw,46px); }
.cafe-section-label { color: var(--cafe-blue); }
.cafe-section-intro h2, .cafe-menu-head h2, .cafe-join-head h2, .cafe-booking-head h2 { margin: 0; font-size: clamp(52px, 6.6vw, 104px); line-height: .91; letter-spacing: -.065em; }
.cafe-section-intro h2 { font-size:clamp(46px,5.6vw,82px); }
.cafe-section-intro h2 em { color: var(--cafe-coral); }
.cafe-place-grid { display: grid; grid-template-columns: 1.45fr .78fr .78fr; grid-template-rows: minmax(220px, auto) minmax(155px, auto); gap: 14px; }
.cafe-place-card, .cafe-place-info { position: relative; padding: clamp(26px, 3vw, 48px); border-radius: 6px; overflow: hidden; }
.cafe-place-card { min-height: 220px; display: flex; flex-direction: column; justify-content: space-between; background: var(--cafe-paper); border: 1px solid #ded7ca; }
.cafe-place-card span { font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.cafe-place-card h3 { margin: auto 0 15px; font-size: clamp(36px, 3.5vw, 58px); line-height: 1; letter-spacing: -.06em; }
.cafe-place-card p { max-width: 440px; margin: 0; font-size: 16px; line-height: 1.55; }
.cafe-place-card-main { grid-row: span 2; color: white; background: var(--cafe-blue); border-color: var(--cafe-blue); }
.cafe-place-card-main h3 { margin-top: 90px; font-size: clamp(58px, 6vw, 96px); }
.cafe-place-card-mint { background: var(--cafe-mint); border-color: var(--cafe-mint); }
.cafe-place-card-coral { background: var(--cafe-coral); border-color: var(--cafe-coral); }
.cafe-card-lines { position: absolute; right: -40px; bottom: 30px; left: 54%; display: grid; gap: 18px; transform: rotate(-16deg); opacity: .2; }
.cafe-card-lines i { height: 2px; background: white; }
.cafe-place-info { padding: 0; grid-column: 2 / 4; display: grid; grid-template-columns: 1fr 1fr; color: white; background: var(--cafe-navy); }
.cafe-place-info > div { padding: 32px; border-right: 1px solid rgba(255,255,255,.15); }
.cafe-place-info small { display: block; margin-bottom: 10px; color: var(--cafe-mint); font-size: 10px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.cafe-place-info strong { display: block; font-size: clamp(17px, 1.45vw, 23px); line-height: 1.3; }
.cafe-place-info a { grid-column: 1 / 3; min-height: 62px; padding: 0 30px; display: flex; justify-content: space-between; align-items: center; color: var(--cafe-navy); background: white; font-size: 14px; font-weight: 900; }

.cafe-menu { padding: clamp(30px, 4vw, 52px) 0; display:flex; align-items:center; color: white; background: #0b244a; scroll-margin-top: 90px; }
.cafe-menu > .container { width:100%; }
.cafe-menu-head { display: grid; grid-template-columns: 1fr minmax(280px, 430px); gap: 48px; align-items: end; margin-bottom: clamp(28px,3vw,44px); }
.cafe-menu-head .cafe-section-label { color: var(--cafe-mint); }
.cafe-menu-head h2 { color: white; font-size:clamp(44px,5vw,74px); }
.cafe-menu-head > p { margin: 0 0 8px; color: #bdcde2; font-size: 18px; line-height: 1.55; }
.cafe-menu-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid rgba(255,255,255,.22); border-left: 1px solid rgba(255,255,255,.22); }
.cafe-menu-category { padding: clamp(28px, 4vw, 56px); border-right: 1px solid rgba(255,255,255,.22); border-bottom: 1px solid rgba(255,255,255,.22); }
.cafe-menu-category header { display: flex; align-items: baseline; gap: 18px; margin-bottom: 36px; }
.cafe-menu-category header span { color: var(--cafe-mint); font-size: 11px; font-weight: 900; }
.cafe-menu-category h3 { margin: 0; font: italic 400 clamp(35px, 4vw, 57px)/1 Georgia, serif; }
.cafe-menu-category article { padding: 18px 0; display: grid; grid-template-columns: 1fr auto; gap: 24px; border-top: 1px dashed rgba(255,255,255,.2); }
.cafe-menu-category h4 { display: inline; margin: 0; font-size: 17px; }
.cafe-menu-category article span { margin-left: 10px; padding: 4px 7px; color: var(--cafe-navy); background: var(--cafe-mint); border-radius: 99px; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.cafe-menu-category article p { margin: 7px 0 0; color: #aebfd6; font-size: 13px; line-height: 1.45; }
.cafe-menu-category article > strong { color: var(--cafe-mint); font-size: 17px; white-space: nowrap; }
.cafe-menu-empty { padding: 60px; color: var(--cafe-navy); background: var(--cafe-mint); font-size: 22px; }

.cafe-menu-experience { position: relative; }
.cafe-menu-filters { margin-bottom: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid rgba(255,255,255,.24); border-radius: 999px; overflow: hidden; }
.cafe-menu-filters button { position: relative; min-height: 56px; padding: 0 22px; color: #c3d2e5; background: transparent; border: 0; border-right: 1px solid rgba(255,255,255,.2); font: inherit; font-size: 14px; font-weight: 850; cursor: pointer; transition: color .2s ease, background .2s ease; }
.cafe-menu-filters button:last-child { border-right: 0; }
.cafe-menu-filters button:hover { color: white; background: rgba(255,255,255,.06); }
.cafe-menu-filters button.is-active { color: var(--cafe-navy); background: var(--cafe-mint); }
.cafe-menu-filters button i { position: absolute; right: 22px; bottom: 14px; left: 22px; height: 2px; background: currentColor; opacity: 0; transform: scaleX(.3); transition: opacity .2s ease, transform .2s ease; }
.cafe-menu-filters button.is-active i { opacity: .5; transform: scaleX(1); }
.cafe-menu-slider-shell { position: relative; }
.cafe-menu-slider-meta { margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; }
.cafe-menu-slider-meta > p { margin: 0; color: #91a7c3; font-size: 13px; font-weight: 850; letter-spacing: .12em; }
.cafe-menu-slider-meta > p span { color: var(--cafe-mint); font-size: 22px; }
.cafe-menu-slider-controls { display: flex; gap: 10px; }
.cafe-menu-slider-controls button { width: 44px; height: 44px; display: grid; place-items: center; color: white; background: transparent; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; cursor: pointer; transition: color .2s ease, background .2s ease, opacity .2s ease; }
.cafe-menu-slider-controls button:hover:not(:disabled) { color: var(--cafe-navy); background: var(--cafe-mint); }
.cafe-menu-slider-controls button:disabled { opacity: .25; cursor: default; }
.cafe-menu-slider-controls svg { width: 22px; }
.cafe-menu-track { display: flex; gap: 22px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; touch-action: pan-x pan-y; }
.cafe-menu-track::-webkit-scrollbar { display: none; }
.cafe-product-card { flex: 0 0 min(840px, 77vw); height:clamp(330px,43svh,400px); min-height:0; display: grid; grid-template-columns: 1.08fr .92fr; color: var(--cafe-ink); background: var(--cafe-paper); border-radius: 8px; overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; }
.cafe-product-image { position: relative; min-height: 100%; overflow: hidden; background: var(--cafe-cream); }
.cafe-product-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.cafe-product-card:hover .cafe-product-image img { transform: scale(1.025); }
.cafe-product-image > span { position: absolute; top: 22px; left: 22px; padding: 10px 14px; color: var(--cafe-navy); background: var(--cafe-mint); border-radius: 999px; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.cafe-product-copy { padding: clamp(24px, 3vw, 38px); display: flex; flex-direction: column; }
.cafe-product-copy > p:first-child { margin: 0 0 auto; color: var(--cafe-blue); font-size: 11px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.cafe-product-copy > div { margin-top: 24px; }
.cafe-product-copy h3 { margin: 0; font-size: clamp(38px, 4vw, 56px); line-height: .92; letter-spacing: -.065em; }
.cafe-product-copy > div > strong { display: block; margin-top: 22px; color: var(--cafe-coral); font: italic 400 28px/1 Georgia, serif; }
.cafe-product-ingredients { margin: auto 0 0; padding-top: 26px; color: #536176; border-top: 1px solid #d8dee6; font-size: 15px; line-height: 1.55; }
.cafe-product-ingredients span { display: block; margin-bottom: 8px; color: var(--cafe-navy); font-size: 10px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.cafe-menu-swipe { margin: 14px 0 0; display: flex; align-items: center; gap: 12px; color: #9eb0c9; font-size: 12px; font-weight: 750; }
.cafe-menu-swipe span { width: 48px; height: 1px; position: relative; background: var(--cafe-mint); }
.cafe-menu-swipe span::after { content: ''; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-top: 1px solid var(--cafe-mint); border-right: 1px solid var(--cafe-mint); transform: rotate(45deg); }

.cafe-join-block { position:relative; z-index:1; width:100%; min-height:calc(100svh - 72px); height:auto; padding:clamp(40px,5vw,72px) 0; display:block !important; overflow:visible !important; visibility:visible !important; opacity:1 !important; background:var(--cafe-coral); scroll-margin-top:80px; }
.cafe-join-block > .container { width:100%; }
.cafe-join-head { display: grid; grid-template-columns: 1fr auto minmax(280px, .68fr); gap: clamp(24px, 3vw, 46px); align-items: end; margin-bottom: 18px; }
.cafe-join-head h2 em { color: white; }
.cafe-join-head h2 { font-size:clamp(40px,4.2vw,62px); }
.cafe-join-head .cafe-section-label { color: var(--cafe-navy); }
.cafe-price { width: 118px; height: 118px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: var(--cafe-navy); background: var(--cafe-mint); border: 2px solid var(--cafe-navy); border-radius: 50%; transform: rotate(-7deg); box-shadow: 7px 8px 0 var(--cafe-navy); }
.cafe-price strong { font-size: 44px; line-height: .9; letter-spacing: -.08em; }
.cafe-price span { margin-top: 9px; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.cafe-join-copy p { margin: 0 0 20px; font-size: 17px; line-height: 1.55; }
.cafe-join-copy ul { margin: 0; padding: 0; list-style: none; }
.cafe-join-copy li { padding: 9px 0 9px 24px; position: relative; border-top: 1px solid rgba(13,47,99,.2); font-size: 13px; font-weight: 800; }
.cafe-join-copy li::before { content: '✓'; position: absolute; left: 0; color: white; font-weight: 900; }
.cafe-join-block .cafedet-join-flow { max-width: none; margin: 0; background: var(--cafe-paper); border: 0; border-radius: 7px; box-shadow: 18px 20px 0 rgba(13,47,99,.18); }
.cafe-join-block .cafedet-join-flow fieldset { padding:clamp(24px,3vw,38px); }
.cafe-join-block .membership-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.cafe-join-block .membership-grid label.wide { grid-column:span 2; }
.cafe-join-block .membership-signature canvas { height:150px; }
.cafe-join-block .membership-form-progress { background: var(--cafe-navy); border-radius: 6px 6px 0 0; }
.cafe-join-block .cafedet-join-flow legend { float: left; padding: 0; }
.cafe-join-block .cafedet-join-flow legend + * { clear: both; }
.cafe-join-block .cafedet-join-fields { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cafe-join-block .membership-submit-panel { background:var(--cafe-paper); color:var(--cafe-navy); border-top:1px solid rgba(13,47,99,.18); }
.cafe-join-block .membership-submit-panel { grid-template-columns:auto minmax(0,1fr) auto; }
.cafe-join-block .membership-submit-panel > div span { color:var(--cafe-blue); }
.cafe-join-block .membership-submit-panel > div small { color:#586b84; }
.cafe-join-block .membership-submit-panel > button { color:#fff; background:var(--cafe-navy); border:2px solid var(--cafe-navy); box-shadow:0 8px 0 var(--cafe-mint); }
.cafe-join-block .membership-submit-panel > button:hover:not(:disabled) { color:#fff; background:var(--cafe-blue); transform:translateY(-2px); }
.cafe-join-block .membership-submit-panel > button:focus-visible { outline:3px solid var(--cafe-mint); outline-offset:4px; }
.cafe-join-form-label { margin: 0 0 18px; display: flex; align-items: center; gap: 16px; color: var(--cafe-navy); font-size: 12px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.cafe-join-form-label i { height: 1px; flex: 1; background: rgba(13,47,99,.35); }

.cafe-join-dock {
  position: fixed;
  right: clamp(18px, 3vw, 44px);
  bottom: clamp(18px, 3vw, 38px);
  z-index: 90;
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 12px 16px 12px 22px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 999px;
  color: white;
  background: var(--cafe-navy);
  box-shadow: 0 18px 55px rgba(4,24,58,.28);
  cursor: pointer;
  transition: transform .24s ease, opacity .2s ease, box-shadow .24s ease;
}
.cafe-join-dock:hover { transform: translateY(-3px); box-shadow: 0 23px 62px rgba(4,24,58,.36); }
.cafe-join-dock:focus-visible { outline: 3px solid var(--cafe-mint); outline-offset: 4px; }
.cafe-join-dock span { display: grid; gap: 2px; text-align: left; }
.cafe-join-dock small { color: var(--cafe-mint); font-size: 10px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.cafe-join-dock strong { font-size: 15px; line-height: 1.1; }
.cafe-join-dock b { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--cafe-navy); background: var(--cafe-coral); font-size: 16px; }
.cafe-join-dock svg { width: 22px; height: 22px; }
.cafe-join-dock svg path { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.cafe-booking { padding: clamp(28px, 3vw, 42px) 0; display:flex; align-items:center; color: white; background: var(--cafe-blue); scroll-margin-top: 80px; }
.cafe-booking > .container { width:100%; }
.cafe-booking-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 470px); gap: 60px; align-items: end; margin-bottom: 20px; }
.cafe-booking-head .cafe-section-label { color: var(--cafe-mint); }
.cafe-booking-head h2 em { color: var(--cafe-mint); }
.cafe-booking-head h2 { font-size:clamp(40px,4.5vw,64px); }
.cafe-booking-head > p { margin: 0 0 10px; color: #d5e3f5; font-size: 18px; line-height: 1.55; }
.cafedet-booking-form { padding: clamp(26px, 3vw, 42px); color: var(--cafe-ink); background: var(--cafe-paper); border-radius: 7px; box-shadow: 18px 20px 0 #0a2855; }
.cafedet-booking-progress { margin-bottom:22px; display:flex; align-items:center; gap:14px; }
.cafedet-booking-progress button { min-height:44px; display:flex; align-items:center; gap:9px; padding:0; color:#718096; background:transparent; border:0; font:inherit; font-size:12px; font-weight:850; cursor:pointer; }
.cafedet-booking-progress button:disabled { cursor:default; }
.cafedet-booking-progress strong { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; color:white; background:#9cadc2; }
.cafedet-booking-progress button.is-active { color:var(--cafe-navy); }
.cafedet-booking-progress button.is-active strong { color:var(--cafe-navy); background:var(--cafe-coral); box-shadow:0 0 0 5px rgba(244,125,97,.14); }
.cafedet-booking-progress button.is-done strong { color:var(--cafe-navy); background:var(--cafe-mint); }
.cafedet-booking-progress i { width:60px; height:1px; background:#cdd7e4; }
.cafedet-form-step[hidden] { display:none; }
.cafedet-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.cafedet-form-grid label { display: grid; gap: 9px; }
.cafedet-form-grid label.wide { grid-column: span 2; }
.cafedet-form-grid label > span { font-size: 12px; font-weight: 800; }
.cafedet-form-grid input, .cafedet-form-grid textarea { width: 100%; min-width: 0; padding: 15px 17px; color: var(--cafe-ink); background: white; border: 1px solid #c9d0db; border-radius: 5px; font: inherit; outline: none; transition: border .2s ease, box-shadow .2s ease; }
.cafedet-form-grid input { min-height: 54px; }
.cafedet-form-grid textarea { min-height:104px; resize:vertical; }
.cafedet-form-grid input:focus, .cafedet-form-grid textarea:focus { border-color: var(--cafe-blue); box-shadow: 0 0 0 3px rgba(23,79,159,.13); }
.cafedet-form-footer { margin-top: 20px; padding-top: 18px; display: flex; justify-content: space-between; gap: 30px; align-items: center; border-top: 1px solid #d9dee6; }
.cafedet-booking-next { margin-top:20px; padding-top:18px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid #d9dee6; }
.cafedet-booking-next > span { color:#718096; font-size:12px; font-weight:800; }
.cafedet-booking-next button, .cafedet-booking-back { min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:14px; padding:10px 20px; border:0; border-radius:999px; color:white; background:var(--cafe-navy); font:inherit; font-size:13px; font-weight:900; cursor:pointer; }
.cafedet-booking-next svg { width:20px; }
.cafedet-booking-back { flex:0 0 auto; color:var(--cafe-navy); background:#eaf1f9; }
.cafedet-form-footer p { max-width: 560px; margin: 0; color: #56657a; font-size: 13px; line-height: 1.5; }
.cafedet-submit { min-height: 58px; padding: 0 24px; display: inline-flex; align-items: center; gap: 22px; color: white; background: var(--cafe-navy); border: 0; border-radius: 999px; font: inherit; font-size: 14px; font-weight: 900; cursor: pointer; }
.cafedet-submit svg { width: 21px; }
.cafedet-submit:disabled { opacity: .6; cursor: wait; }
.cafedet-form-state { min-height: 22px; margin: 18px 0 0; font-size: 13px; font-weight: 700; }
.cafedet-form-state.is-success, .cafedet-form-state.is-pending { color: #17735f; }
.cafedet-form-state.is-error { color: #bb2828; }
.cafedet-honeypot { position: absolute !important; left: -9999px !important; }
.cafedet-booking-closed { padding: 45px; color: var(--cafe-navy); background: var(--cafe-paper); border-radius: 7px; }
.cafedet-booking-closed strong { font-size: 25px; }

@media (max-width: 1100px) {
  .cafe-hero { min-height: auto; }
  .cafe-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .75fr); gap: 50px; }
  .cafe-visual { min-height: 530px; }
  .cafe-visual-word { font-size: 60px; }
  .cafe-join-head { grid-template-columns: 1fr auto; }
  .cafe-join-copy { grid-column: 1 / 3; max-width: 720px; }
  .cafedet-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cafedet-form-grid label.wide { grid-column:1 / -1; }
}

@media (max-width: 860px) {
  .cafe-hero { padding-top: 104px; }
  .cafe-hero-grid { grid-template-columns: 1fr; }
  .cafe-hero-copy { max-width: 720px; }
  .cafe-hero h1 { font-size: clamp(72px, 15vw, 112px); }
  .cafe-visual { width: min(100%, 580px); min-height: 560px; margin: 0 auto; }
  .cafe-local-nav .container { min-height: 0; grid-template-columns: repeat(3, 1fr); }
  .cafe-local-nav a { min-height: 64px; border-bottom: 1px solid #ded8cf; }
  .cafe-local-nav a:nth-child(2) { border-right: 1px solid #ded8cf; }
  .cafe-section-intro { grid-template-columns: 1fr; gap: 14px; }
  .cafe-place-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; }
  .cafe-place-card-main { grid-row: auto; grid-column: 1 / 3; min-height: 380px; }
  .cafe-place-info { grid-column: 1 / 3; }
  .cafe-menu-head, .cafe-booking-head { grid-template-columns: 1fr; gap: 24px; }
  .cafe-menu-head > p, .cafe-booking-head > p { max-width: 620px; }
  .cafe-menu-grid { grid-template-columns: 1fr; }
  .cafe-menu-filters { grid-template-columns: repeat(2, 1fr); border-radius: 10px; }
  .cafe-menu-filters button:nth-child(2) { border-right: 0; }
  .cafe-menu-filters button:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.2); }
  .cafe-product-card { flex-basis: min(700px, 88vw); min-height: 500px; }
  .cafe-join-block .membership-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cafe-join-block .membership-grid label.wide { grid-column:1 / -1; }
  .cafe-join-block .cafedet-join-fields { grid-template-columns:1fr; }
}

@media (max-width: 620px) {
  .cafe-hero { padding: 82px 0 52px; }
  .cafe-eyebrow { align-items: flex-start; flex-direction: column; gap: 10px; line-height: 1.35; }
  .cafe-hero h1 { font-size: clamp(58px, 20vw, 82px); line-height: .82; }
  .cafe-hero-lead { margin-top: 28px; font-size: 17px; }
  .cafe-hero-actions { display: grid; }
  .cafe-button { width: 100%; }
  .cafe-hero-facts { gap: 12px 20px; }
  .cafe-visual { min-height: 440px; padding: 24px; border-radius: 8px 44px 8px 44px; box-shadow: 12px 14px 0 rgba(1,20,50,.32); }
  .cafe-visual::before { inset: 10px; border-radius: 5px 34px 5px 34px; }
  .cafe-visual-word { margin-top: 42px; font-size: clamp(44px, 15vw, 59px); }
  .cafe-cup { right: 30px; bottom: 85px; width: 112px; height: 112px; padding: 20px; }
  .cafe-sticker { min-width: 68px; min-height: 68px; font-size: 14px; box-shadow: 5px 5px 0 var(--cafe-navy); }
  .cafe-sticker-one { top: 205px; right: -12px; }
  .cafe-sticker-two { bottom: 70px; left: -12px; }
  .cafe-sticker-three { top: 267px; left: 26px; }
  .cafe-visual-bottom { right: 24px; bottom: 22px; left: 24px; }
  .cafe-visual-bottom span { display: none; }
  .cafe-visual-bottom strong { margin-left: auto; }
  .cafe-local-nav a { padding: 0 8px; font-size: 13px; }
  .cafe-place { padding-top: 84px; padding-bottom: 84px; }
  .cafe-section-intro { margin-bottom: 42px; }
  .cafe-section-intro h2, .cafe-menu-head h2, .cafe-join-head h2, .cafe-booking-head h2 { font-size: clamp(47px, 15vw, 68px); }
  .cafe-place-grid { grid-template-columns: 1fr; }
  .cafe-place-card-main, .cafe-place-info { grid-column: auto; }
  .cafe-place-card-main { min-height: 320px; }
  .cafe-place-card-main h3 { margin-top: 70px; }
  .cafe-place-card { min-height: 230px; }
  .cafe-place-info { grid-template-columns: 1fr; }
  .cafe-place-info > div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.15); }
  .cafe-place-info a { grid-column: auto; }
  .cafe-menu, .cafe-join-block, .cafe-booking { padding: 84px 0; }
  .cafe-menu-head { margin-bottom: 48px; }
  .cafe-menu-category { padding: 28px 22px; }
  .cafe-menu-category header { margin-bottom: 25px; }
  .cafe-menu-category article { gap: 13px; }
  .cafe-menu-filters { margin-bottom: 24px; }
  .cafe-menu-filters button { min-height: 58px; padding: 0 12px; font-size: 12px; }
  .cafe-menu-filters button i { right: 14px; bottom: 10px; left: 14px; }
  .cafe-menu-slider-controls button { width: 48px; height: 48px; }
  .cafe-menu-track { gap: 14px; }
  .cafe-product-card { flex-basis: calc(100vw - 40px); min-height: 0; grid-template-columns: 1fr; }
  .cafe-product-card { height:auto; }
  .cafe-product-image { min-height: 0; aspect-ratio: 1 / .92; }
  .cafe-product-copy { min-height: 330px; padding: 27px 22px; }
  .cafe-product-copy > div { margin-top: 52px; }
  .cafe-product-copy h3 { font-size: clamp(38px, 12vw, 52px); }
  .cafe-menu-swipe { margin-top: 18px; }
  .cafe-join-head { grid-template-columns: 1fr; align-items: start; margin-bottom: 44px; }
  .cafe-price { width: 132px; height: 132px; }
  .cafe-price strong { font-size: 46px; }
  .cafe-join-copy { grid-column: auto; }
  .cafe-join-block .cafedet-join-flow { box-shadow: 8px 10px 0 rgba(13,47,99,.18); }
  .cafe-join-block .membership-grid { grid-template-columns:1fr; }
  .cafe-join-block .membership-grid label.wide { grid-column:auto; }
  .cafe-join-dock { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); min-height: 62px; gap: 12px; padding: 9px 11px 9px 17px; }
  .cafe-join-dock b { width: 44px; height: 44px; }
  .cafe-join-dock svg { display: none; }
  .cafe-join-block { min-height:calc(100svh - 72px); padding:20px 0; }
  .cafe-join-head { grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; margin-bottom:10px; }
  .cafe-join-head h2 { font-size:clamp(30px,9.2vw,40px); line-height:.92; }
  .cafe-join-head .cafe-section-label { margin-bottom:6px; font-size:9px; }
  .cafe-join-copy, .cafe-join-form-label { display:none; }
  .cafe-price { width:70px; height:70px; box-shadow:4px 5px 0 var(--cafe-navy); }
  .cafe-price strong { font-size:25px; }
  .cafe-price span { margin-top:5px; font-size:7px; }
  .cafe-join-block .membership-submit-panel { grid-template-columns:auto 1fr; }
  .cafedet-booking-form { padding: 24px 18px; box-shadow: 8px 10px 0 #0a2855; }
  .cafedet-form-grid { grid-template-columns: 1fr; gap: 17px; }
  .cafedet-form-grid label.wide { grid-column: auto; }
  .cafedet-form-footer { align-items: stretch; flex-direction: column; }
  .cafedet-booking-next { align-items:stretch; flex-direction:column; }
  .cafedet-booking-next button, .cafedet-booking-back { width:100%; }
  .cafedet-submit { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .cafe-button, .cafe-join-dock { transition: none; }
}
