/* Greivy® 1.2 — Iris Noir × Porcelain / warm editorial edition.
   Only image layers are tinted: text and functional interface colors remain exact. */
:root{--control-line:#887284;--image-warmth-opacity:.12;--warm-hue:#D9A17F;--motion-ease:cubic-bezier(.22,1,.36,1)}
:root[data-theme='dark']{--control-line:#8C7797;--warm-hue:#D4A98F}
body{font-size:clamp(16px,1.09vw,18px)}
.nav-links a{font-size:.8rem;letter-spacing:.075em}
.eyebrow{font-size:.75rem;letter-spacing:.145em;text-transform:none}
.text-link{background:transparent;color:var(--accent);border:0;border-bottom:1px solid currentColor;padding:0 0 7px;font-size:.79rem;cursor:pointer;border-radius:0}
.text-link:focus-visible,.sf-action:focus-visible,.sf-atlas-card:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.icon-button{width:44px;height:44px;border-color:var(--control-line)}
.field input,.field select,.field textarea,.voyage-mobile-select select{border:1px solid var(--control-line);border-radius:11px;min-height:47px;outline-offset:3px}
.sf-choice-list label{border-color:var(--control-line);min-height:44px;align-items:center;transition:background .2s,color .2s,border-color .2s,transform .3s var(--motion-ease)}
.sf-choice-list label:hover{transform:translateY(-2px);border-color:var(--accent)}
.sf-choice-list input:focus-visible+label{outline-width:3px}
.button,.sf-action{min-height:44px;transition:transform .35s var(--motion-ease),box-shadow .35s var(--motion-ease),background .2s,color .2s}
.button:hover,.sf-action:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(83,41,68,.16)}

/* Globally consistent, opt-in warmth for photographs and video, not UI or PNGs. */
:is(.image-frame,.ed-visual,.voyage-photo,.media-frame,.hero-film,.post-cover-frame,.profile-layout>div:first-child,.voyage-cover-frame,.sf-result-photo,.voyage-gallery button){position:relative;isolation:isolate;overflow:hidden}
:is(.image-frame,.ed-visual,.voyage-photo,.media-frame,.hero-film,.post-cover-frame,.profile-layout>div:first-child,.voyage-cover-frame,.sf-result-photo,.voyage-gallery button)::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(122deg,rgba(235,187,142,.7),rgba(159,79,93,.38) 60%,rgba(84,52,91,.18)),radial-gradient(circle at 23% 11%,#FFE1B2,transparent 62%);opacity:var(--image-warmth-opacity);mix-blend-mode:soft-light}
:root[data-theme='dark'] :is(.image-frame,.ed-visual,.voyage-photo,.media-frame,.hero-film,.post-cover-frame,.profile-layout>div:first-child,.voyage-cover-frame,.sf-result-photo,.voyage-gallery button)::before{opacity:var(--image-warmth-opacity)}
.hero-film::before{border-radius:inherit}
.hero-film::after{z-index:2}
:is(.ed-visual,.voyage-photo)::after{z-index:2}
.sf-result-photo img{width:100%;height:245px;object-fit:cover;border-radius:8px}
.voyage-cover-frame img{width:100%;height:100%;max-height:650px;object-fit:cover;aspect-ratio:4/5}
.post-cover-frame{margin-bottom:clamp(45px,7vw,95px)}
.post-cover-frame img{margin:0}

/* Spring tilting affects visual photography only. Focus and prose never tilt. */
.animated-tile{--light-x:50%;--light-y:50%;will-change:auto;transform-style:preserve-3d;transition:box-shadow .45s var(--motion-ease)}
.animated-tile img{transform:translate3d(var(--photo-x,0px),var(--photo-y,0px),0) scale(1.035);transition:transform .32s var(--motion-ease);will-change:auto}
.animated-tile:hover img{transform:translate3d(var(--photo-x,0px),var(--photo-y,0px),0) scale(1.07)}
.animated-tile:hover{box-shadow:0 25px 64px rgba(53,27,55,.15)}
.preview-card.image-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%}
.preview-card.image-frame .preview-caption{position:absolute;z-index:3;left:8%;top:48%;transform:translateY(-50%);color:#FFF9FB;text-shadow:0 3px 28px rgba(14,8,20,.5)}
.preview-card.image-frame::after{z-index:3;color:#FFF9FB;text-shadow:0 1px 6px rgba(14,8,20,.5)}
.animated-tile::before{background-image:radial-gradient(circle at var(--light-x) var(--light-y),rgba(255,241,218,.47),transparent 58%),linear-gradient(122deg,rgba(235,187,142,.7),rgba(159,79,93,.38) 60%,rgba(84,52,91,.18))}
.ed-visual:hover::after,.ed-visual:focus-visible::after{transform:scale(1)}

/* Controlled scroll reveals: classes are added only when IntersectionObserver exists. */
html.motion-ready .reveal-on-scroll{opacity:0;transform:translate3d(0,25px,0);transition:opacity .8s var(--motion-ease),transform .85s var(--motion-ease)}
html.motion-ready .reveal-on-scroll.in-view{opacity:1;transform:none}
.story-card:focus-within{position:relative;z-index:4}
.story-card a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}

/* Scent Finder — tactile editorial stationery instead of browser-grey buttons. */
.sf-controls{border:1px solid var(--line);box-shadow:0 18px 60px rgba(57,27,50,.055)}
.sf-actions{display:flex;flex-wrap:wrap;gap:11px;margin:24px 0}
.sf-action{display:inline-flex;align-items:center;justify-content:center;gap:13px;padding:12px 18px;border-radius:999px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-size:.78rem;font-weight:700;letter-spacing:.035em;line-height:1.3;text-align:center;cursor:pointer}
.sf-action span{font-size:1.18rem;font-weight:400;line-height:1}
.sf-action--surprise{background:var(--accent);color:var(--bg)}
.sf-action--surprise:hover{background:var(--iris);border-color:var(--iris);color:var(--bg)}
.sf-action--reset{background:var(--bg)}
.sf-action--more{margin-top:28px;background:var(--surface);padding:14px 25px}
.sf-atlas-footer{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:26px}
.sf-atlas-footer .sf-action--more{margin-top:0}
.sf-action[hidden]{display:none}
.sf-constellation{border-block:1px solid var(--line);padding:20px 0;margin-top:20px}
.sf-constellation .form-note{margin:7px 0 13px}
.sf-note-tray{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-height:52px}
.sf-tray-placeholder{font:italic 1.1rem/1.5 var(--font-display);color:var(--muted)}
.sf-tray-chip{border:1px solid var(--control-line);background:var(--bg);color:var(--ink);border-radius:999px;padding:8px 12px;min-height:44px;font-size:.82rem;cursor:pointer}
.sf-tray-chip:hover{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.sf-tray-status{font-size:.74rem;color:var(--muted);min-height:20px;margin:9px 0 0}
.sf-result-match{display:inline-block;color:var(--accent);font-size:.72rem;font-weight:700;line-height:1.4}
.sf-atlas-card[aria-pressed='true']{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent),0 14px 38px rgba(74,40,70,.12)}
.sf-atlas-card{border-color:var(--control-line)}
.demo-editor input,.demo-editor select,.demo-editor textarea{border-color:var(--control-line);border-radius:9px}
.sf-atlas-state{margin-top:auto;padding-top:6px;font-size:.7rem;font-weight:700;color:var(--accent)}
.sf-note-grid .sf-ingredient{border:1px solid var(--line)}

@media(max-width:1050px){.nav-links a{font-size:.8rem}.icon-button{width:44px;height:44px}}
@media(max-width:720px){.sf-controls{padding:25px 20px}.sf-actions{display:grid;grid-template-columns:1fr 1fr}.sf-action{padding:12px 10px}.sf-atlas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sf-result-photo img{height:220px}.hero-film{will-change:auto}.voyage-cover-frame img{max-height:520px}}
@media(max-width:380px){.sf-actions{grid-template-columns:1fr}.sf-note-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.animated-tile,.animated-tile img{transform:none!important;transition:none!important}.animated-tile::before{background-image:linear-gradient(122deg,rgba(235,187,142,.7),rgba(159,79,93,.38))}html.motion-ready .reveal-on-scroll{opacity:1!important;transform:none!important}.sf-action:hover,.button:hover,.sf-choice-list label:hover{transform:none}}
