/* Art direction, persistent tour controls, and quiet page navigation. */
.hero-photo picture{display:block;width:100%;height:100%}
.hero-phone{width:256px}
.header-inner nav>a[aria-current="location"]:not(.button){color:#9d762d;text-decoration:underline;text-underline-offset:7px}
.tour-heading{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:28px}
.tour-heading h2{font-size:clamp(32px,3.5vw,46px)}
.tour-heading>p{max-width:430px;font-size:16px!important;line-height:1.6}
.tour-heading .eyebrow{font-size:12px;margin-bottom:12px;color:#806332}
.demo-studio{position:relative;isolation:isolate}
.guide-tabs{display:grid;grid-template-columns:1fr 1fr;position:sticky;top:80px;z-index:12;gap:0;margin:0;padding:6px;background:#e5dece;border:1px solid #d2c6b1;border-bottom:0;border-radius:14px 14px 0 0;box-shadow:0 7px 20px #2425200a}
.guide-tabs button,.guide-tabs button[aria-selected="true"]{min-height:70px;display:flex;align-items:center;gap:15px;padding:12px 20px;border:0;border-radius:9px;background:transparent;color:#555b50;box-shadow:none}
.guide-tabs button[aria-selected="true"]{background:#fffdf7;color:#252d27;box-shadow:0 2px 7px #3c321219}
.guide-tabs button:hover{background:#f6f0e4}
.guide-tabs strong{font-size:17px;line-height:1.2;letter-spacing:-.02em}
.guide-tabs small{font-size:12px;line-height:1.3;margin-top:5px;color:#756e5e}
.guide-tabs button>.icon{width:23px;height:23px}
.guide-tabs .perspective-number{flex:0;font-size:12px;color:#928369;margin-left:auto}
.guided-showcase{border-radius:0 0 14px 14px;overflow:clip;background:#f3efe7}
.listener-presentation{grid-template-columns:1fr 1fr;gap:35px;padding:28px 55px;min-height:550px}
.guide-intro>h3{font-size:40px;line-height:1.1}.guide-intro>p:not(.eyebrow){font-size:17px;line-height:1.6;margin-bottom:23px}
.tour-keypoints{display:grid;gap:12px;color:#666757;font-size:14px}
.tour-keypoints>span{display:flex;align-items:center;gap:10px}.tour-keypoints .icon{width:17px;height:17px;color:#9b7b3a}
.guided-phone{width:248px;max-width:none;border-radius:29px;box-shadow:0 15px 40px #26272021}
.dashboard-intro{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:22px 30px}
.dashboard-intro h3{font-size:27px;flex-shrink:0;margin:0}
.dashboard-intro p{font-size:15px;max-width:560px}
.guided-dashboard iframe{height:505px}
.guide-player{padding:17px 25px 16px;background:#fffdf8}
.guide-chapters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:14px}
.guide-chapters button{position:relative;min-height:39px;padding:8px 12px;border:1px solid #dfd6c5;border-radius:6px;background:#f8f5ed;color:#716751;font:500 13px Inter,sans-serif;line-height:1.25}
.guide-chapters button[aria-current="step"]{color:#fffaf0;background:#353f34;border-color:#353f34}
.guide-chapters button:hover{border-color:#ad8640}
.guide-caption-row{display:flex;align-items:center;justify-content:space-between;gap:20px}
.guide-caption-row>p{font-size:15px;line-height:1.4;font-weight:550;color:#404536;min-height:21px}
.guide-motion{font-size:13px;min-height:40px;min-width:44px;padding:8px 0;text-align:right;flex-shrink:0}
.guide-timing{width:100%;max-width:none;min-width:0;margin:6px 0 12px;gap:15px}
.guide-timing progress{flex:1;min-width:0;height:3px}
#guide-time{display:block;font-size:12px;color:#847761}
.guide-footer{display:flex;align-items:center;justify-content:space-between;gap:18px}
.guide-disclosure{margin:0;font-size:12px;max-width:360px;color:#847c6a}
.guide-other{border:0;background:none;padding:7px 0;min-height:40px;display:inline-flex;gap:12px;align-items:center;color:#775925;font:650 14px Inter,sans-serif;text-align:right;line-height:1.4}
.guide-other:hover{color:#292f23;text-decoration:underline;text-underline-offset:4px}
.explore-dock{position:fixed;z-index:54;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:0;padding:5px;background:#252e2a;color:#fff9e9;border:1px solid #a88e54;border-radius:35px;box-shadow:0 5px 22px #15211829;transition:opacity .2s,transform .2s;white-space:nowrap}
.explore-dock a,.explore-dock button{display:flex;align-items:center;gap:8px;min-height:43px;padding:10px 17px;color:inherit;font:550 14px Inter,sans-serif;line-height:1.3;border:0;border-radius:24px;background:none;text-decoration:none}
.explore-dock .icon{width:17px;height:17px;color:#dab66b}
.explore-dock a:hover,.explore-dock button:hover{background:#3b463b}
.explore-dock a[aria-current="location"]{background:#48533f;color:#f7deb0}
.explore-dock[data-hidden="true"]{opacity:0;transform:translate(-50%,100px);pointer-events:none;visibility:hidden}
footer{padding-bottom:100px}
@media(max-width:1200px){.hero-phone{width:236px}}
@media(max-width:900px){.hero-phone{width:213px}.guide-tabs{top:70px}.listener-presentation{padding:25px 30px;min-height:510px}.guided-phone{width:226px}.guide-intro>h3{font-size:34px}.guide-intro>p:not(.eyebrow){font-size:16px}.dashboard-intro{display:block}.dashboard-intro h3{margin-bottom:8px}.tour-heading{gap:25px}.tour-heading>p{max-width:290px}}
@media(max-width:700px){
 .hero{padding-bottom:0}
 .hero-photo{aspect-ratio:1/1;height:auto;max-height:520px}
 .hero-photo img{object-fit:cover;object-position:center center}
 .hero-photo:after{background:linear-gradient(0deg,#fbfaf744,transparent 30%)}
 .hero-device-wrap{position:absolute;right:12px;bottom:15px;margin:0;transform:none;z-index:5}
 .hero-phone{width:clamp(135px,42vw,230px);border-width:5px;border-radius:25px}
 .hero-device-wrap .screen-note{display:none}
 .tour-heading{display:block;margin-bottom:23px}.tour-heading h2{font-size:35px}.tour-heading>p{max-width:350px;margin-top:14px!important}.tour-heading>p br{display:none}
 .how-section{padding-top:40px;padding-bottom:42px}
 .guide-tabs{top:66px;padding:5px;border-radius:12px 12px 0 0;gap:3px}
 .guide-tabs button,.guide-tabs button[aria-selected="true"]{min-height:58px;padding:10px 9px;gap:8px}
 .guide-tabs strong{font-size:14px}.guide-tabs small{font-size:12px;margin-top:4px}.guide-tabs button>.icon{width:19px;height:19px}.guide-tabs .perspective-number{display:none}
 .guided-showcase{border-radius:0 0 12px 12px}
 .listener-presentation{display:block;min-height:0;padding:18px 12px}
 .guide-intro{display:none}
 .guided-phone{width:clamp(150px,calc((100svh - 318px)*.462),260px);max-width:100%;border-radius:25px}
 .dashboard-intro{display:none}
 .guided-dashboard iframe{height:clamp(325px,calc(100svh - 318px),560px)}
 .guided-dashboard .guide-browser{height:28px;font-size:12px}
 .guide-player{padding:11px 12px 12px}
 .guide-chapters{gap:5px;margin-bottom:7px}
 .guide-chapters button{font-size:12px;padding:8px 3px;min-height:38px}
 .guide-caption-row{gap:14px}.guide-caption-row>p{font-size:14px;min-height:39px;display:flex;align-items:center}
 .guide-motion{font-size:12px;min-height:40px}
 .guide-timing{margin:4px 0 9px}
 .guide-footer{gap:10px;align-items:center}
 .guide-disclosure{font-size:12px;max-width:175px;line-height:1.4}
 .guide-other{font-size:13px;gap:8px;max-width:150px;min-height:44px;justify-content:flex-end;padding:0}
 .explore-dock{bottom:max(12px,env(safe-area-inset-bottom));max-width:calc(100% - 24px);padding:4px}
 .explore-dock a,.explore-dock button{font-size:14px;padding:10px 12px;gap:6px;min-height:42px}
 .explore-dock .icon{width:15px;height:15px}
}
@media(max-width:370px){.hero-phone{width:42vw}.hero-device-wrap{right:10px;bottom:12px}.guide-tabs button>.icon{display:none}.guide-tabs strong{font-size:14px}.guide-tabs small{font-size:11px}.guide-chapters button{font-size:11px}.explore-dock a,.explore-dock button{padding:10px;font-size:14px}.explore-dock .icon{display:none}}
@media(prefers-reduced-motion:reduce){.explore-dock{transition:none}}

/* Keep the dashboard occupied while its first frame is prepared. */
.dashboard-frame-wrap{position:relative}
.dashboard-loading{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center;background:#f3efe7;color:#343d33}
.dashboard-loading[hidden]{display:none}
.dashboard-loading strong{font-size:18px;line-height:1.4;font-weight:600}
.dashboard-loading span{font-size:14px;line-height:1.5;color:#716a5c;max-width:280px}
/* Short rules separate the three actions without changing their tap targets. */
.explore-dock>a,.explore-dock>button{position:relative}
.explore-dock>*+*:before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);height:18px;width:1px;background:#d7c49755;pointer-events:none}