:root{color-scheme:dark;--ink:#f0f0e9;--font:'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif}*{box-sizing:border-box}body{margin:0;background:#111d20;color:var(--ink);font-family:var(--font);height:100svh;min-height:600px;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:1px solid currentColor;outline-offset:7px}.film,.shade{position:fixed;inset:0;pointer-events:none}.film{background:#182421 url('assets/tide-poster.jpg') center/cover;overflow:hidden}.film video{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.32) brightness(.58) contrast(1.08)}.shade{background:linear-gradient(180deg,#0714184d,transparent 28%,#06141925 65%,#061114b3),linear-gradient(90deg,#071a1eaa, #071a1e65 38%,transparent 85%)}header,footer{position:absolute;left:5.5%;right:5.5%;display:flex;justify-content:space-between;align-items:center}header{top:45px}.brand{font-size:25px;font-weight:550;letter-spacing:5px;display:flex;align-items:center;gap:19px}.brand-mark{width:24px;height:11px;border-top:1px solid #efefe6b0;border-bottom:1px solid #efefe670;transform:skewY(-22deg)}.text-button{border:0;background:transparent;padding:10px 0;font-size:14px;display:flex;align-items:center;gap:17px;letter-spacing:1px}.menu-icon{display:grid;gap:5px;width:19px}.menu-icon i{height:1px;background:currentColor}.menu-icon i:last-child{width:12px;margin-left:auto;transition:width .3s}.text-button:hover .menu-icon i:last-child{width:19px}main{position:absolute;top:50%;left:15%;transform:translateY(-52%)}.eyebrow{font-size:14px;letter-spacing:5px;opacity:.65;margin:0 0 30px;animation:arrive 1.8s both}h1{font-size:clamp(44px,4.6vw,74px);font-weight:400;line-height:1.65;letter-spacing:.13em;margin:0;text-shadow:0 2px 30px #0002;animation:arrive 1.8s .1s both}.statement{font-size:15px;letter-spacing:3px;line-height:1.8;margin:28px 0 0;opacity:.75;animation:arrive 1.8s .25s both}footer{bottom:33px;gap:20px}.company{font-size:14px;letter-spacing:1px;color:#efefe6a3}.controls{display:flex;align-items:center;gap:28px}.controls .text-button{font-size:13px;gap:12px;color:#efefe6a3}.sound{border:0;background:transparent;display:flex;align-items:center;gap:12px;font-size:14px;padding:10px 0;letter-spacing:1px}.equalizer{display:flex;align-items:center;gap:3px;height:17px}.equalizer i{width:1px;height:4px;background:currentColor}.sound[aria-pressed=true] .equalizer i{animation:wave 1.4s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.7s!important}.equalizer i:nth-child(3){animation-delay:-1.1s!important}.equalizer i:nth-child(4){animation-delay:-.4s!important}dialog{inset:0 0 0 auto;margin:0;width:min(540px,100%);max-width:100%;height:100svh;max-height:100svh;overflow:auto;background:#e5e7df;color:#20312f;border:0;padding:115px 60px 45px}dialog[open]{animation:arrive .6s both}dialog::backdrop{background:#07121190;backdrop-filter:blur(7px)}.close{position:absolute;right:35px;top:30px}.close span{font-size:25px}.panel-kicker{font-size:14px;letter-spacing:3px;opacity:.65}dialog h2{font-size:42px;font-weight:450;line-height:1.55;letter-spacing:2px;margin:38px 0}dialog p{font-size:16px;line-height:2;letter-spacing:1px;margin:24px 0}.panel-company{border-top:1px solid #20312f30;padding-top:26px;margin-top:45px;font-size:14px;line-height:1.8}.credit{font-size:11px;opacity:.6;display:inline-block;margin-top:24px}@keyframes arrive{from{opacity:0;translate:0 16px;filter:blur(3px)}to{translate:0 0;filter:none}}@keyframes wave{to{height:17px}}@media(max-width:600px){body{min-height:600px}header,footer{left:7%;right:7%}header{top:28px}.brand{font-size:23px;letter-spacing:3px;gap:12px}.brand-mark{width:18px;height:8px}.text-button{font-size:14px;gap:11px}main{left:10%;top:46%;transform:translateY(-50%)}.eyebrow{font-size:14px;letter-spacing:3px;margin-bottom:24px}h1{font-size:46px;line-height:1.6;letter-spacing:.08em}.statement{font-size:14px;letter-spacing:1px;margin-top:25px}footer{bottom:24px;flex-direction:column-reverse;align-items:flex-start;gap:18px}.company{font-size:14px;letter-spacing:0}.controls{gap:30px}.controls .text-button{font-size:14px}.film video{object-position:58% center}dialog{padding:100px 30px 35px}dialog h2{font-size:37px;margin:30px 0}.panel-company{margin-top:30px}}@media(max-width:360px){h1{font-size:40px}.brand{font-size:21px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* V3 refinement: restrained editorial serif and a slight cool cast. */
h1{font-family:'Songti SC','STSong','Noto Serif CJK SC',serif;font-weight:400;letter-spacing:.12em}
dialog h2{font-family:'Songti SC','STSong','Noto Serif CJK SC',serif;font-weight:400}
.film::after{content:'';position:absolute;inset:0;background:rgba(25,71,98,.16);mix-blend-mode:color;pointer-events:none}
.shade{background:linear-gradient(180deg,#0715224d,transparent 28%,#071b2725 65%,#07131fb3),linear-gradient(90deg,#091c2aaa,#091d2865 38%,transparent 85%)}
@media(max-width:600px){h1{letter-spacing:.1em}}

/* Tide aperture identity: quiet geometry, institutional wordmark. */
.brand{gap:13px;letter-spacing:4px;font-size:24px}
.brand img{width:42px;height:42px;flex-shrink:0}
.brand-wordmark{display:block;font-weight:500;line-height:1.25}
.brand-wordmark small{display:block;font-size:10px;letter-spacing:1.5px;font-weight:400;margin-top:8px;color:#dce6e9a8}
@media(max-width:600px){.brand{font-size:21px;gap:9px;letter-spacing:3px}.brand img{width:34px;height:34px}.brand-wordmark small{font-size:9px;letter-spacing:.7px;margin-top:6px}}

/* Unified outlined wordmark, matching the square tide symbol. */
.brand img.brand-lockup{width:calc(206px * var(--logo-width-ratio,1));height:auto}
@media(max-width:600px){.brand img.brand-lockup{width:calc(175px * var(--logo-width-ratio,1));height:auto}}

/* Current two-row bilingual lockup; crop-only SVG keeps its ink on the page grid. */
.brand img.brand-lockup--current{width:120px;height:auto;display:block}
@media(max-width:600px){.brand img.brand-lockup--current{width:104px}}