/* Custom blue glass artwork. Review prototype, 2026-10-22. */
.hero-stage {
  background:#f5f9ff;
  border-radius:28px 28px 0 0;
}
.glass-scene {
  position:absolute;
  inset:-28px -30px -4px;
  z-index:-1;
  background:url('assets/blue-glass-ribbon.svg') center 48% / cover no-repeat;
  transform-origin:50% 55%;
  animation:glass-drift 20s ease-in-out infinite alternate;
}
.glass-scene::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#fff5 0%,#ffffff00 42%,#fff0 69%,#fff 100%);
}
.landing {--site-header-height:62px;--site-header-gap:22px}
.site-header-slot {position:relative;display:flow-root;min-height:calc(var(--site-header-height) + var(--site-header-gap))}
.site-header-trigger {position:absolute;left:50%;top:calc(var(--site-header-gap) - max(12px,env(safe-area-inset-top)));width:1px;height:1px;pointer-events:none}
.site-header {
  height:var(--site-header-height);
  margin-top:var(--site-header-gap);
  color:#111;
  background:#1119233d;
  border:0;
  background-clip:padding-box;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:none;
}
.site-header .wordmark img,.site-header .wordmark {filter:none}
.site-header .desktop-nav a,.site-header .login-link {position:relative;color:#111;font-weight:500;text-shadow:none}
.site-header .desktop-nav a::after,.site-header .login-link::after {content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 160ms ease-out}
.site-header .desktop-nav a:hover,.site-header .login-link:hover {color:var(--action)}
.site-header .desktop-nav a:is(:hover,:focus-visible)::after,.site-header .login-link:is(:hover,:focus-visible)::after {transform:scaleX(1)}
.site-header .mobile-toggle {color:#111}
.site-header .mobile-toggle:hover {background:#1111110a}
.site-header :focus-visible {outline-color:var(--action)}
.site-header.is-pinned {position:fixed;top:max(12px,env(safe-area-inset-top));left:0;right:0;width:min(1180px,calc(100% - 96px));margin:0 auto;overflow:clip;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:header-arrive 160ms ease-out both}
.mobile-nav.is-pinned {position:fixed;top:calc(max(12px,env(safe-area-inset-top)) + var(--site-header-height) + 8px);left:20px;right:20px;width:auto;margin:0}
.motion-paused .site-header.is-pinned,.capture .site-header.is-pinned {animation:none}
.mobile-nav {
  color:#111;
  background:#f5f9fff2;
  border:0;
  background-clip:padding-box;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  box-shadow:none;
}
.mobile-nav a {color:#111;border-radius:8px;text-shadow:none}
.mobile-nav a:hover {color:var(--action);background:#ffffff12}
@keyframes header-arrive {from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1550px) {.landing {--site-header-gap:26px}}
@media(max-width:800px) {.site-header.is-pinned {width:calc(100% - 68px)}}
@media(max-width:620px) {
  .landing {--site-header-height:55px;--site-header-gap:13px}
  .site-header.is-pinned {width:calc(100% - 40px)}
}
.generate-button {
  width:30px;
  min-width:30px;
  height:30px;
  padding:0;
  border-radius:50%;
  display:inline-grid;
  place-items:center;
  flex:none;
  gap:0;
  transition:background .2s,box-shadow .2s,transform .2s;
}
.generate-button svg {width:15px;height:15px;stroke-width:1.8}
.generate-button:hover:not(:disabled) {box-shadow:0 4px 12px #2563eb26;transform:translateY(-1px)}
.generate-button:active:not(:disabled) {transform:scale(.96)}
.week-strip .today {background:transparent;color:#2563eb;border-radius:0;font-weight:600}
.resources {padding-top:64px}
.hero-copy {padding-top:62px}
.hero h1 {font-weight:650;letter-spacing:-2.7px}
.hero-copy>p {color:#66788e;font-size:14px;margin-top:23px}
.hero-actions {margin-top:27px}
.product-stage {width:min(1120px,92%);height:394px;margin-top:54px}
.creator-wrap {width:590px;top:0}
.reference-wrap {width:244px;left:0;top:38px;opacity:1}
.schedule-wrap {width:244px;right:0;top:62px;opacity:1}
.creator-card {
  box-shadow:0 25px 65px #3667a31a,0 2px 7px #3667a308;
  border:1px solid #fff;
}
.creator-body {padding:27px 27px 20px}
.creator-body h2 {font-size:23px}
.reference-card {
  transform:rotate(-5deg);
  border:1px solid #fff;
  box-shadow:0 18px 45px #3766a31a;
}
.reference-photo {height:155px;object-position:center 52%}
.reference-bottom {padding-top:12px}
.reference-bottom strong {font-size:12px;font-weight:550}
.reference-bottom small {font-size:9px;margin-top:4px}
.commerce-caption {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:9px 1px 0;
  margin-top:9px;
  border-top:1px solid #eaf0f7;
  font-size:8px;
  color:#8a9bab;
}
.commerce-caption span:first-child {color:var(--action);display:flex;align-items:center;gap:4px}
.commerce-caption svg {width:10px;height:10px}
.schedule-card {transform:rotate(5deg);box-shadow:0 18px 45px #3766a316}
.closing {background:#f0f6ff;isolation:isolate}
.closing-art {
  position:absolute;
  z-index:-1;
  inset:-280px -50px -190px;
  background:url('assets/blue-glass-ribbon.svg') center 52% / cover no-repeat;
}
.closing-copy h2 {font-weight:600}
.closing-copy>p {color:#5c7390}
.closing-orbit {display:none}
.auth-preview {background:#f6f9ff}
.auth-visual {background:#edf5ff;border-left-color:#e8f1ff}
.auth-visual::before {
  background:url('assets/blue-glass-ribbon.svg') 74% 47% / auto 125% no-repeat;
  filter:none;
  opacity:.9;
}
.auth-visual-copy h2 {font-weight:550;letter-spacing:-1.2px}
.auth-visual-copy p {color:#627c97}
.auth-art-poster {box-shadow:0 16px 45px #3a72ae20}
.auth-art-mini {box-shadow:0 18px 40px #3a72ae24}
.editorial-poster::after,.creator-scene .scene-image::after,.auth-art-poster::after {display:none}
.editorial-poster>img {object-position:50% center}
.poster-title,.editorial-poster small,.auth-art-poster>span,.auth-art-poster>small {
  color:#354361;
  text-shadow:none;
}
.editorial-poster .poster-title {font-size:29px;font-weight:400;line-height:1.12;letter-spacing:-.6px}
.editorial-poster small {font-size:9px;max-width:140px}
.scene-grid .scene-card .scene-image .scene-image-copy {
  font-family:var(--font);
  color:#283546;
  font-size:25px;
  font-weight:550;
  line-height:1.45;
  letter-spacing:0;
  text-shadow:none;
  z-index:2;
}
.scene-grid .creator-scene .scene-image>img {object-position:center bottom}
.commerce-scene .scene-image {background:#f3f2f0}
.commerce-scene .scene-image::before {
  content:none;
}
.commerce-scene .scene-image>img {object-position:center 62%}
.commerce-scene .scene-arrow {z-index:2}
.mini-phone {background:#edf0f6;box-shadow:0 18px 38px #4774a320}
.mini-phone>img {object-position:50% center}
.phone-back>img {object-position:42% center}
.phone-front>img {object-position:50% 72%}
.phone-overlay {
  padding:0;
  color:#354361;
  background:linear-gradient(180deg,#ffffff7a 0%,#fff0 21%,#fff0 60%,#fffffff0 87%,#fff 100%);
}
.phone-overlay small {position:absolute;left:14px;bottom:82px;font-size:6px;letter-spacing:1px}
.phone-overlay strong {
  position:absolute;
  left:14px;
  bottom:32px;
  font-size:19px;
  font-weight:500;
  line-height:1.28;
  letter-spacing:-.4px;
  margin:0;
  text-shadow:none;
}
.phone-overlay>span {left:14px;bottom:14px;font-size:6px;color:#79889d}
.phone-platform {color:#354361;text-shadow:none}
.phone-social-icons {color:#52637d;bottom:51px;gap:9px;right:11px}
.phone-social-icons svg {width:12px;height:12px;stroke-width:1.6}
@keyframes glass-drift {
  from {transform:translate3d(-7px,0,0) scale(1.015)}
  to {transform:translate3d(7px,-8px,0) scale(1.035)}
}
@media(min-width:1700px) {
  .glass-scene {background-position:center 58%}
}
@media(max-width:1100px) and (min-width:901px) {
  .creator-wrap {width:500px}
  .reference-wrap,.schedule-wrap {width:202px}
  .reference-photo {height:135px}
  .creator-body {padding:24px}
  .creator-body h2 {font-size:22px}
}
@media(min-width:621px) {
  .mobile-nav {display:none}
  .capability-copy,.operations-copy {translate:0 -16px}
}
@media(max-width:1100px) {
  .scene-grid .scene-card .scene-image .scene-image-copy {font-size:23px}
}
@media(max-width:800px) and (min-width:621px) {
  .scene-grid .scene-card .scene-image .scene-image-copy {font-size:21px}
}
@media(max-width:900px) {
  .product-stage {
    width:min(620px,calc(100% - 48px));
    height:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    padding-bottom:48px;
    margin-top:42px;
  }
  .product-stage .float-wrap {position:relative;inset:auto;width:100%;transform:none;animation:none;opacity:1}
  .creator-wrap {grid-column:1/-1;grid-row:1;z-index:5}
  .reference-wrap {grid-column:1;grid-row:2}
  .schedule-wrap {grid-column:2;grid-row:2}
  .reference-card,.schedule-card {height:100%;transform:none;animation:none}
  .reference-photo {height:160px}
  .schedule-card {padding:20px 17px}
  .glass-scene {inset:0 -120px -8px;background-position:center 50%}
}
@media(max-width:620px) {
  .mobile-nav {
    left:12px;
    right:12px;
    top:calc(var(--site-header-gap) + var(--site-header-height) + 8px);
    padding:10px;
  }
  .resources {padding-top:42px}
  .generate-button {width:28px;min-width:28px;height:28px}
  .generate-button svg {width:14px;height:14px}
  .scene-grid .scene-card .scene-image .scene-image-copy {font-size:22px;left:18px;top:18px}
  .scene-grid .scene-main .scene-image .scene-image-copy {font-size:25px;left:24px;top:23px}
  .hero-copy {padding-top:40px}
  .hero h1 {font-size:43px;letter-spacing:-1.6px}
  .hero-copy>p {font-size:11px;padding-inline:20px;margin-top:18px;line-height:1.8}
  .hero-actions {gap:20px;margin-top:23px}
  .product-stage {width:calc(100% - 36px);gap:12px;margin-top:32px;padding-bottom:32px}
  .creator-body {padding:20px 14px 15px}
  .creator-body h2 {font-size:18px}
  .reference-card {padding:11px}
  .reference-card .mini-title {font-size:9px}
  .reference-photo {height:115px;margin-top:9px}
  .reference-bottom {padding:8px 0 1px}
  .reference-bottom strong {font-size:10px}
  .reference-bottom small {font-size:8px;margin-top:3px}
  .commerce-caption {font-size:7px;margin-top:7px;padding-top:7px;gap:3px}
  .commerce-caption>span:last-child {display:none}
  .schedule-card {padding:13px 11px}
  .schedule-card .mini-title {font-size:9px}
  .schedule-row strong {font-size:9px}
  .schedule-row small {font-size:7px}
  .schedule-row {gap:6px}
  .schedule-task-icon {width:24px;height:27px}
  .schedule-task-icon svg {width:12px;height:12px}
  .schedule-footer {font-size:7px}
  .glass-scene {inset:0 -270px 0;background-position:center 70%;opacity:.8}
  .closing-art {inset:-160px -200px -150px;background-position:48% 52%}
  .editorial-poster .poster-title {font-size:24px}
  .phone-overlay strong {font-size:17px}
  .phone-overlay small {bottom:76px}
}
@media(max-width:360px) {
  .scene-grid .scene-card .scene-image .scene-image-copy {font-size:18px;left:14px}
  .hero h1 {font-size:38px}
  .product-stage {width:calc(100% - 28px);gap:9px}
  .reference-photo {height:98px}
  .schedule-card {padding-inline:9px}
  .schedule-task-icon {display:none}
  .schedule-row {gap:3px}
}
@media(prefers-reduced-motion:reduce) {
  .glass-scene {animation:none}
  .site-header.is-pinned {animation:none}
  .site-header .desktop-nav a::after,.site-header .login-link::after {transition:none}
}

.footer-preferences{display:flex;align-items:center;gap:8px}.footer-preferences .motion-toggle{color:#617181;width:28px;height:28px}.footer-preferences svg{width:13px;height:13px}.landing .footer-bottom{flex-wrap:wrap}.landing [data-language-picker]{color:#617181}.landing .auth-language{position:static}