/* Scenio landing · kit-level layout (hero stage, planes, callouts, closing scene, grids, reveals). Component styling lives in the design system. */
html,body{margin:0}
body{background:var(--paper);color:var(--ink);font-family:var(--font-ui)}
.landing{--paper-0:rgba(248,243,235,0)}
.dark .landing{--paper-0:rgba(23,23,23,0)}
.landing a{color:inherit}
.landing main p a:not([class]),.landing main :not(.hero-legend)>li>a:not([class]){color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.landing main p a:not([class]):hover,.landing main li>a:not([class]):hover{color:var(--accent-hover)}
main{position:relative}
.landing a{color:inherit}
/* hero — brief §3: the photograph is full-width the whole time; the copy and the search never move */
.hero-track{position:relative;margin-top:calc(-1 * var(--nav-h))}
@media (max-width:700px){.hero-track{margin-top:calc(-1 * var(--nav-h-mobile))}}
.hero-stage{position:sticky;top:0;height:100vh;height:100svh;min-height:580px;overflow:hidden;background:#2A2523;color:var(--photo-title)}
.hero-film{position:absolute;left:0;top:0;display:block;background:#2A2523}
.hero-anchor{position:absolute;width:0;height:0;pointer-events:none}
/* scrims (O1 as corrected by D-e / D-e2, owner 2026-09-24; D-e is closed) — tokens in helper.css: the copy scrim .70→.68 over 0–42 %, 0 by 62 % (≥ 1180); below 1180 the plateau runs past the copy's right edge (.70→.66 to 64 %, 0 by 84 %); ≤ 700 one full-width copy scrim .68; the header band .62 held to the nav height, then 0 by 16 %. The right side of the film is untouched at ≥ 1180. The measured 5th-percentile contrast is in handoff/RECONCILIATION.md (D-e) */
.hero-scrim{position:absolute;inset:0;pointer-events:none}
.hero-scrim-copy{background:var(--hero-scrim-copy)}
@media (max-width:1179px){.hero-scrim-copy{background:var(--hero-scrim-copy-narrow)}}
@media (max-width:700px){.hero-scrim-copy{background:var(--hero-scrim-copy-mobile)}}
.hero-scrim-top{background:var(--hero-scrim-top)}
/* the copy block — static, left-aligned, below the header */
.hero-copy{position:absolute;z-index:4;left:calc((100% - var(--container)) / 2);top:calc(var(--nav-h) + 6vh);width:min(34vw,620px);min-width:300px;color:var(--photo-title)}
.hero-eyebrow{margin:0 0 14px;font-size:14px;font-weight:500;letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--photo-title)}
.hero-title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(44px,min(4.4vw,8.4vh),80px);line-height:1.04;letter-spacing:var(--tracking-display);color:var(--photo-title);text-wrap:balance}
.hero-word{display:inline-block;position:relative;vertical-align:baseline;white-space:nowrap;color:var(--hero-word);transition:width var(--dur-word-opacity) var(--ease-word)}
.hero-word-measure{position:absolute;left:0;top:0;visibility:hidden;white-space:nowrap;pointer-events:none}
.hero-word-cur{display:inline-block;white-space:nowrap}
.hero-word-cur.is-in{animation:heroWordIn var(--dur-word-opacity) var(--ease-word) both}
.hero-word-cur.is-out{opacity:0;transform:translateY(7px);transition:opacity var(--dur-word-out) var(--ease-word),transform var(--dur-word-out) var(--ease-word)}
@keyframes heroWordIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
.hero-support{margin:16px 0 0;font-size:18px;line-height:1.5;max-width:46ch;color:var(--photo-support)}
.hero-ctas{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.hero-ctas>.sc-btn{min-width:178px;justify-content:center}
.hero-cta-quiet{color:var(--photo-title)!important;border-color:rgba(255,247,239,.55)!important;background:transparent!important}
.hero-cta-quiet:hover{background:rgba(255,247,239,.12)!important}
/* callouts */
.hero-callouts{position:absolute;inset:0;z-index:3;pointer-events:none}
.hero-co{position:absolute;inset:0;transition:opacity var(--dur-overlay) var(--ease-out)}
/* the search panel — centred, its top edge at 72 % of the viewport (owner ruling @ca46aa7), below the copy block, clear of the bottom edge and the flora; one row ≥ 1024, three columns under it; in the flow after the track on mobile */
.hero-search{position:absolute;z-index:5;left:50%;top:72%;transform:translateX(-50%);width:min(880px,calc(100% - 56px));display:grid;grid-template-columns:1.5fr 1.1fr .7fr .9fr auto;gap:8px;align-items:end;margin:0;padding:14px 16px;background:var(--hero-search-ground);border:1px solid rgba(255,247,239,.18);border-radius:var(--radius-panel);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hero-search .sc-ff-label{color:var(--photo-title)}
.hero-search .sc-date-trigger{color:var(--ink)}
@media (max-width:1023px){.hero-search{width:var(--container-tablet);grid-template-columns:1fr 1fr 1fr;top:auto;bottom:24px}}
.hero-search-flow{width:var(--container);margin:24px auto 0}
@media (max-width:1023px){.hero-search-flow{width:var(--container-tablet)}}
@media (max-width:700px){.hero-search-flow{width:var(--container-mobile)}}
.hero-search-flow .hero-search{position:static;transform:none;width:100%;grid-template-columns:1.5fr 1.1fr .7fr .9fr auto;padding:0;background:transparent;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}
@media (max-width:1023px){.hero-search-flow .hero-search{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:700px){.hero-search-flow .hero-search{grid-template-columns:1fr 1fr}.hero-search-flow .hero-search .hero-search-btn{grid-column:1/-1}}
.hero-search-flow .sc-ff-label{color:var(--ink)}
/* legend (compact frames): the callout sets as a row under the text */
.hero-legend{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 22px;max-width:560px}
.hero-legend li{display:none;align-items:baseline;gap:8px;font-size:13px;color:var(--photo-support)}
.hero-legend li a{display:flex;align-items:baseline;gap:8px;color:inherit;text-decoration:none;min-width:0}
.hero-legend li a:hover span,.hero-legend li a:focus-visible span{color:var(--photo-title);text-decoration:underline;text-underline-offset:2px}
.hero-legend li a:focus-visible{outline-color:var(--focus-on-photo)}.hero-legend li a:focus-visible span{text-decoration-color:var(--focus)}
.hero-legend li.is-shown{display:flex;animation:legendIn var(--dur-overlay) var(--ease-out) both}
@keyframes legendIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hero-legend li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--photo-title);flex:none;transform:translateY(-1px)}
.hero-legend b{font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--photo-title)}
@media (max-width:1179px){.hero-copy{width:min(60vw,560px)}}
@media (max-width:1023px){.hero-copy{left:calc((100% - var(--container-tablet)) / 2)}.hero-title{font-size:clamp(40px,min(6vw,8vh),64px)}}
@media (max-width:700px){.hero-copy{left:calc((100% - var(--container-mobile)) / 2);width:var(--container-mobile);min-width:0;top:calc(var(--nav-h-mobile) + 24px)}.hero-title{font-size:clamp(38px,10vw,56px)}.hero-support{font-size:15px;margin-top:10px}.hero-ctas{margin-top:18px}.hero-eyebrow{margin-bottom:10px;font-size:13px}.hero-legend{margin-top:20px;gap:6px 14px}}
/* sections */
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap-grid)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-grid)}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-grid)}
@media (max-width:1023px){.grid-4,.grid-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap-grid-tablet)}.grid-2{gap:var(--gap-grid-tablet)}}
@media (max-width:639px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}}
.item{display:flex;flex-direction:column;min-width:0}
/* item photography (owner rulings 4 @2866819 · 1 @f66c304): every tile carries its own photograph — the mockup crop for now, the slot sized 4:3 for the final file; natural brightness, no scrim */
.item-media{aspect-ratio:4/3;background:var(--surface-2);position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.item-media .item-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.item-body{display:flex;flex-direction:column;gap:8px;padding:14px 16px 6px}
.item-name{font-size:16px;font-weight:600;line-height:1.3}
.item-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.item-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px 14px;font-size:14px;font-variant-numeric:tabular-nums lining-nums}
.item-price b{font-weight:500}
.item-rating{display:inline-flex;align-items:center;gap:4px;color:var(--muted);font-size:13px}
/* event types (§4 · §3b): six tiles, each its own photograph, each a link into Odkrywaj with the type preselected — the name sits on the photograph, the meta under it, an arrow appears on hover */
.events{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap-grid-tablet)}
.events>a{position:relative;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;min-width:0;border:1px solid transparent;border-radius:var(--radius-panel)}

.events .ev-media{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius-panel);background:var(--surface-2)}
.events .ev-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transform:scale(var(--ph,var(--photo-settle-scale)));transition:transform var(--dur-settle) var(--ease-figure);transition-delay:var(--fig-delay)}
.events.is-in .ev-media img{--ph:1}
.events>a:hover .ev-media img,.events>a:focus-visible .ev-media img{--ph:var(--photo-hover-scale);transition-duration:var(--dur-photo);transition-timing-function:var(--ease-out);transition-delay:0ms}
.events .ev-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,0) 34%,rgba(23,23,23,.66));pointer-events:none}
.events .ev-name{position:absolute;left:14px;right:14px;bottom:13px;font-family:var(--font-display);font-weight:600;font-size:clamp(19px,1.55vw,24px);line-height:1.05;color:var(--photo-title);text-wrap:balance;transition:transform var(--dur-state) var(--ease-out)}
.events>a:hover .ev-name{transform:translateY(-3px)}
.events .ev-go{position:absolute;right:10px;top:10px;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--action-label);color:var(--accent);opacity:0;transform:translateY(-5px);transition:opacity var(--dur-state) var(--ease-out),transform var(--dur-state) var(--ease-out)}
.events>a:hover .ev-go,.events>a:focus-visible .ev-go{opacity:1;transform:none}
.events .ev-meta{font-size:13px;color:var(--muted)}
@media (max-width:1023px){.events{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:639px){.events{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* §4 · why — the argument is made as a figure: ten single contracts fanned out, converging into ONE crimson package as the section enters; the four promises sit beside it as a numbered list */
.wy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:center}
.wy-fig{min-width:0}
.wy-cap{display:block;font-size:var(--text-micro);letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--muted);font-weight:500}
.wy-cap-note{display:block;margin-top:5px;font-size:13px;color:var(--muted)}
.wy-stack{position:relative;height:322px;margin-top:20px;transition:height var(--dur-figure) var(--ease-figure);transition-delay:260ms}
.is-lit .wy-stack{height:196px}
.wy-slip{position:absolute;left:0;top:calc(50% - 21px);box-sizing:border-box;display:flex;align-items:center;width:min(310px,88%);height:42px;padding:0 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sub);font-size:14px;color:var(--muted);transform:translateY(calc((var(--k) - 4.5) * 28px)) translateX(calc((var(--k) - 4.5) * 3px)) rotate(calc((var(--k) - 4.5) * 1.5deg));transition:transform var(--dur-figure) var(--ease-figure),opacity var(--dur-reveal) var(--ease-out);transition-delay:calc(var(--k) * 55ms)}
.wy-pack{position:absolute;left:0;right:0;top:calc(50% - 62px);box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:8px;min-height:124px;padding:24px 26px;background:var(--action-fill);color:var(--action-label);border:1px solid var(--action-outline);border-radius:var(--radius-panel);opacity:0;transform:translateY(18px) scale(.975);transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-heading) var(--ease-figure);transition-delay:640ms}
.wy-pack-label{font-family:var(--font-display);font-weight:700;font-size:34px;line-height:1;letter-spacing:var(--tracking-display)}
.wy-pack-note{font-size:14px;color:var(--action-label);opacity:.86}
.is-lit .wy-slip{transform:translateY(calc((var(--k) - 4.5) * 2px)) rotate(0deg);opacity:0}
.is-lit .wy-pack{opacity:1;transform:none}
.wy-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.wy-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--line)}
.wy-num{font-family:var(--font-display);font-weight:700;font-size:30px;line-height:1;color:var(--accent);letter-spacing:var(--tracking-display);font-variant-numeric:tabular-nums lining-nums}
@media (max-width:1023px){.wy{grid-template-columns:1fr;gap:36px}.wy-fig{max-width:520px}.wy-stack{height:300px}.is-lit .wy-stack{height:186px}}
.why-title{font-size:18px;font-weight:600;margin:0 0 6px}
.why-text{margin:0;font-size:14px;line-height:1.55;color:var(--muted)}
/* §4 · providers — three numbered promises, then the plan strip with the feature matrix folded away behind one button */
.pv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-grid)}
.pv>div{border-top:2px solid var(--accent);padding-top:18px}
.pv-num{display:block;font-family:var(--font-display);font-weight:700;font-size:40px;line-height:1;color:var(--accent);letter-spacing:var(--tracking-display);margin-bottom:12px;font-variant-numeric:tabular-nums lining-nums}
@media (max-width:639px){.pv{grid-template-columns:1fr}}
.plans{margin-top:52px;padding-top:34px;border-top:1px solid var(--line)}
.plans-head{margin-bottom:26px}
.plans-label{font-size:var(--text-micro);letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--muted);font-weight:500}
.plans-title{margin:8px 0 0;font-family:var(--font-display);font-weight:700;font-size:28px;line-height:1.08;letter-spacing:var(--tracking-display)}
.plans-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap-grid)}
@media (max-width:1023px){.plans-grid{grid-template-columns:1fr;gap:var(--gap-grid-tablet)}}
.plan{position:relative;box-sizing:border-box;display:flex;flex-direction:column;gap:16px;padding:26px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-panel)}
.plan--popular{border-color:var(--action-outline)}
.plan-flag{position:absolute;right:20px;top:-10px}
.plan-name{font-family:var(--font-display);font-weight:600;font-size:20px;line-height:1;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.plan-price{display:flex;align-items:baseline;gap:9px;font-variant-numeric:tabular-nums lining-nums}
.plan-price b{font-family:var(--font-display);font-weight:700;font-size:40px;line-height:1;letter-spacing:var(--tracking-display)}
.plan-price span{font-size:13px;color:var(--muted)}
.plan-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.45;color:var(--muted)}
.plan-lines li{display:flex;gap:9px;align-items:flex-start}
.plan-lines .sc-icon{flex:none;margin-top:2px}
.plan .sc-btn{margin-top:auto}
.plans-more{margin-top:26px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.plans-note{margin:0;font-size:13px;line-height:1.55;color:var(--muted);max-width:66ch}
.plans-table{overflow:hidden;max-height:0;opacity:0;transition:max-height var(--dur-reveal) var(--ease-out),opacity var(--dur-morph) var(--ease-out),margin-top var(--dur-reveal) var(--ease-out)}
.plans-table.is-open{max-height:640px;opacity:1;margin-top:24px}
/* §4 · testimonials — the opinions move left on their own, three in view; hover or focus holds them */
/* testimonials (W1.7, brief §4): three static cards — the marquee is gone, nothing moves without a pause control */
/* closing band — scenio-pattern §8.6 in a ~52 vh band; the photograph moves with scroll progress. Interim: the mockup's closing plate (closing-live-celebration) in a 16:9-ready slot until closing/day.png and night.png are generated */
.closing{position:relative;height:52vh;min-height:430px;max-height:560px;overflow:hidden;background:#1E1A18;color:var(--photo-title)}
.closing-plane{position:absolute;inset:-6% 0;will-change:transform}
.closing-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.closing-scrim{position:absolute;left:0;right:0;bottom:0;height:100%;background:linear-gradient(180deg,rgba(23,23,23,.18),rgba(23,23,23,.58));pointer-events:none}
.closing-copy{position:absolute;left:0;right:0;bottom:0;top:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:0 24px;pointer-events:none}
.closing-scrim{z-index:1}
.closing-copy>*{pointer-events:auto}
.closing-eyebrow{margin:0;font-size:14px;font-weight:500;letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--photo-title)}
.closing-text{margin:0;font-size:17px;line-height:1.5;color:var(--photo-support);max-width:56ch;text-wrap:pretty}
.closing-ctas{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.closing-ctas>.sc-btn{min-width:214px;justify-content:center}
.closing-cta-quiet{color:var(--photo-title)!important;border-color:rgba(255,247,239,.55)!important;background:transparent!important}
.closing-cta-quiet:hover{background:rgba(255,247,239,.12)!important}
.closing-title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(32px,3.6vw,56px);line-height:1.04;letter-spacing:var(--tracking-display);color:var(--photo-title);max-width:22ch;text-wrap:balance}
@media (max-width:700px){.closing-copy{gap:12px}.closing-text{font-size:15px}.closing-ctas{width:100%;flex-direction:column}.closing-ctas>.sc-btn{width:100%;min-width:0}}
/* scroll choreography (§8) — nothing below the hero arrives complete. Per section (.is-lit, set by one IntersectionObserver): the hairline draws left to right, then the label, title, description and links rise in sequence. Photographs never land together: every figure wipes up under its own card with a slow settle, staggered by its index in the grid. */
.landing .sc-ps--hairline{position:relative;border-top-color:transparent}
.landing .sc-ps--hairline::before{content:'';position:absolute;left:0;top:0;height:1px;width:100%;background:var(--line);transform:scaleX(0);transform-origin:left center;transition:transform var(--dur-hairline) var(--ease-out)}
.landing .sc-ps--hairline.is-lit::before{transform:scaleX(1)}
.landing .sc-ps-head>div>*,.landing .sc-ps-head>.sc-ps-links{opacity:0;transform:translateY(var(--reveal-rise));transition:opacity var(--dur-heading) var(--ease-heading),transform var(--dur-heading) var(--ease-heading)}
.landing .sc-ps-head>div>.sc-ps-headline{transition-delay:60ms}
.landing .sc-ps-head>div>.sc-ps-title{transition-delay:150ms}
.landing .sc-ps-head>div>.sc-ps-desc{transition-delay:250ms}
.landing .sc-ps-head>.sc-ps-links{transition-delay:330ms}
.landing .sc-ps.is-lit .sc-ps-head>div>*,.landing .sc-ps.is-lit .sc-ps-head>.sc-ps-links{opacity:1;transform:none}
/* reveals */
.reveal{--fig-delay:calc(var(--i,0) * 130ms + 140ms)}
.reveal>*{opacity:0;transform:translateY(var(--reveal-rise));transition:opacity var(--dur-reveal) var(--ease-out),transform var(--dur-reveal) var(--ease-out);transition-delay:calc(var(--i,0)*80ms)}
.reveal.is-in>*{opacity:1;transform:none}
.reveal .item-media,.reveal .ev-media{clip-path:inset(0 0 101% 0);transition:clip-path var(--dur-mask) var(--ease-mask);transition-delay:var(--fig-delay)}
.reveal.is-in .item-media,.reveal.is-in .ev-media{clip-path:inset(0 0 0 0)}
.reveal .item-media .item-photo{transform:scale(var(--photo-settle-scale));transition:transform var(--dur-settle) var(--ease-figure);transition-delay:var(--fig-delay)}
.reveal.is-in .item-media .item-photo{transform:none}
/* reduced motion — the ONE hand-written rule: the reveals and the section choreography are gated by an IntersectionObserver and offset by delays (60 → 640 ms, 80 / 55 / 130 ms staggers); a 0 ms token cannot say "already there", so this forces the end state before anything scrolls into view. Every other reduced-motion resolution is the tokens' 0 ms (tokens/motion.css: OS setting = .reduced). */
.reduced .landing .sc-ps--hairline::before,.reduced .landing .sc-ps-head>div>*,.reduced .landing .sc-ps-head>.sc-ps-links,.reduced .reveal>*,.reduced .landing .wy-slip,.reduced .landing .wy-pack,.reduced .landing .wy-stack,.reduced .reveal .item-media,.reduced .reveal .ev-media,.reduced .reveal .item-media .item-photo,.reduced .events .ev-media img{transition:none}
.reduced .landing .sc-ps--hairline::before,.reduced .landing .sc-ps-head>div>*,.reduced .landing .sc-ps-head>.sc-ps-links,.reduced .reveal>*{opacity:1;transform:none}
.reduced .reveal .item-media,.reduced .reveal .ev-media{clip-path:none}
.reduced .reveal .item-media .item-photo,.reduced .events .ev-media img{transform:none}
/* footer company block — the §6 horizontal lockup: mark + SCENIO in Alumni Sans 400, the legal name in medium, then the named parts (address · contact · registry) */
.company{font-style:normal;font-size:14px;line-height:1.65}
.company-group{display:block;font-size:var(--text-micro);letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--muted);font-weight:500;margin-bottom:14px}
.company .lockup{display:inline-flex;align-items:center;gap:10px;color:var(--accent);margin-bottom:18px;text-decoration:none}
.company .lockup .mark{width:26px;height:36px;background:currentColor;-webkit-mask:var(--logo-mark) center/contain no-repeat;mask:var(--logo-mark) center/contain no-repeat}
.company .lockup .word{font-family:var(--font-display);font-weight:400;font-size:24px;line-height:1;letter-spacing:.2em;text-transform:uppercase}
.company .legal{display:block;font-weight:600;font-size:15px;color:var(--ink);margin-bottom:18px}
.company-parts{display:grid;gap:16px}
.company-part{display:grid;gap:3px}
.company-part .lbl{font-size:var(--text-micro);letter-spacing:var(--tracking-micro);text-transform:uppercase;color:var(--muted);font-weight:500}
.company-part .val{font-size:14px;line-height:1.6;color:var(--ink)}
.company-part .val a{color:var(--ink);text-decoration:none}
.company-part .val a:hover{color:var(--accent);text-decoration:underline}
.company-part--registry .val{font-variant-numeric:tabular-nums lining-nums}
.company .muted{color:var(--muted)}
/* prototype control (not product UI) */
.devbar{position:fixed;right:16px;bottom:16px;z-index:70;display:flex;align-items:center;gap:12px;padding:8px 10px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-panel);box-shadow:var(--shadow-overlay);font-size:12px}
.devbar .p{font-variant-numeric:tabular-nums;color:var(--muted);min-width:44px}
@media (max-width:639px){.devbar{left:12px;right:12px;bottom:12px;flex-wrap:wrap}}

/* watermark (brand-watermark card): the big FINAL mark halved across two consecutive sections — its right half at the left edge of Offers, its left half lower down at the right edge of Promoted; crimson at 6 %, clamp(560px, 62vw, 1040px) tall, behind the cards, never on the photograph bands */
.landing #offers,.landing #promoted{position:relative;isolation:isolate;overflow:hidden}
.landing #offers::after,.landing #promoted::after{content:"";position:absolute;width:auto;z-index:-1;pointer-events:none;height:var(--wm-size-split,clamp(560px,62vw,1040px));aspect-ratio:454/640;background:var(--accent);opacity:var(--wm-opacity-split,.06);-webkit-mask:url(../../assets/logo/logo-mark.svg) center/contain no-repeat;mask:url(../../assets/logo/logo-mark.svg) center/contain no-repeat}
.landing #offers::after{left:0;top:6%;transform:translateX(-50%)}
.landing #promoted::after{right:0;top:28%;transform:translateX(50%)}
.dark .landing #offers::after,.dark .landing #promoted::after,.landing.dark #offers::after,.landing.dark #promoted::after{background:var(--paper-100,#F8F3EB);opacity:.07}
/* accents — slots for NEW engraved artwork in the mark’s hand (ACCENTS.md), one per section under the hero; each ::after masks assets/accents/<motif>.svg in crimson (paper on dark). The whole accent layer is gated behind [data-accents] on the landing root: until the owner adds the files AND the attribute, no rule references a missing file, so the page makes no 404 request (render rule, delivery 13). The big split mark stays on Offers and Promoted; the logo is never cut for accents. */
.landing #partners,.landing #venues,.landing #events,.landing #services,.landing #why,.landing #testimonials,.landing #providers{position:relative;isolation:isolate;overflow:hidden}
.landing .sc-stl{position:relative;isolation:isolate}
.landing[data-accents] #partners::after,.landing[data-accents] #venues::after,.landing[data-accents] #events::after,.landing[data-accents] #services::after,.landing[data-accents] #why::after,.landing[data-accents] #testimonials::after,.landing[data-accents] #providers::after,.landing[data-accents] .sc-stl::after{content:"";position:absolute;z-index:-1;pointer-events:none;width:auto;aspect-ratio:var(--acc-ratio,1);background:var(--accent);-webkit-mask:var(--acc) center/contain no-repeat;mask:var(--acc) center/contain no-repeat}
.landing[data-accents] #partners::after{--acc:url(../../assets/accents/glasses.svg);height:64px;left:50%;top:10px;transform:translateX(-50%);opacity:.12}
.landing[data-accents] #venues::after{--acc:url(../../assets/accents/olive-branch.svg);height:clamp(260px,26vw,420px);right:-2%;bottom:2%;opacity:.07}
.landing[data-accents] #events::after{--acc:url(../../assets/accents/peonies.svg);height:clamp(150px,14vw,220px);left:25%;bottom:0;transform:translateX(-50%);opacity:.08}
.landing[data-accents] #services::after{--acc:url(../../assets/accents/wine-and-bottle.svg);height:clamp(220px,22vw,340px);left:1.5%;top:12%;opacity:.07}
.landing[data-accents] #why::after{--acc:url(../../assets/accents/laurel.svg);height:clamp(90px,9vw,140px);left:50%;top:14px;transform:translateX(-50%);opacity:.08}
.landing[data-accents] #testimonials::after{--acc:url(../../assets/accents/wildflowers.svg);height:clamp(170px,16vw,260px);left:3%;bottom:0;opacity:.07}
.landing[data-accents] #providers::after{--acc:url(../../assets/accents/candles.svg);height:clamp(160px,15vw,240px);right:25%;bottom:0;transform:translateX(50%);opacity:.07}
.landing[data-accents] .sc-stl::after{--acc:url(../../assets/accents/oak-tree.svg);--acc-ratio:.8;height:min(70vh,560px);right:3%;top:18vh;opacity:.06}
.dark .landing section::after,.landing.dark section::after,.landing.dark .sc-stl::after{background:var(--paper-100,#F8F3EB)}
.landing .plans-toggle{margin-top:28px}
/* hero: the quarter-disc switch in frame A's bottom-right corner turns the scroll film off — the stage becomes the static frame A (100vh, the mobile rule) and the page scrolls straight on; remembered in localStorage (scenio.hero.still) */
.hero-still{position:absolute;right:0;bottom:max(0px, calc(100% - 100vh));bottom:max(0px, calc(100% - 100dvh));z-index:6;width:64px;height:64px;box-sizing:border-box;padding:24px 0 0 26px;border:1px solid rgba(255,247,239,.45);border-right:0;border-bottom:0;border-radius:64px 0 0 0;background:var(--hero-still-ground);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--photo-title,#FFF7EF);cursor:pointer;display:block;transition:background-color var(--dur-fast,150ms) ease,border-color var(--dur-fast,150ms) ease}
.hero-still:hover{background:rgba(23,23,23,.72)}
.hero-still:focus-visible{outline-color:var(--focus-on-photo);box-shadow:0 0 0 6px var(--focus-halo)}
.hero-still[aria-pressed="true"]{background:rgba(112,30,54,.72)}
/* prototype only: the DevBar owns the bottom-right corner (fixed, right/bottom 16px, ~50px tall) — lift the switch above it; production has no DevBar */
.landing:has(.devbar) .hero-still{bottom:calc(max(0px, 100% - 100vh) + 82px);bottom:calc(max(0px, 100% - 100dvh) + 82px);border-radius:64px 0 0 64px;border-bottom:1px solid rgba(255,247,239,.45);height:56px;padding:18px 0 0 24px}

/* W2.16 footer: the legal row wraps at every width; the 24 / 44 px legal targets are UFooter's rule (M3); W1.13 contact links get 24 px line boxes */
.legal-row{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;width:100%}
.legal-row a,.legal-cookie{font:inherit;font-size:13px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
.legal-cookie{background:none;border:0;padding:0;cursor:pointer}
.company .val a{display:inline-block;min-height:24px;line-height:24px}
