/* The shared product layout and carousel live in the Senetus stylesheet. */
body[data-app]{--display:system-ui,sans-serif;--title-weight:600;--title-tracking:-.055em;--title-case:none;--example-bg:#151517;--border:#35353a;--line:var(--border);--cta-ink:#111}
body[data-app="daycore"]{--accent:#8df58a;--display:Menlo,Consolas,monospace;--title-weight:700;--title-case:uppercase;--title-tracking:.015em;--example-bg:#0c160d;--border:#26382a;--slide-x:-20.4%;--slide-y:-22.9%;--slide-w:140.8%;--slide-h:141.2%}
body[data-app="time-console"]{--accent:#96e7a8;--display:"Courier New",monospace;--title-weight:700;--title-tracking:-.075em;--example-bg:#0d1511;--border:#283b30}
body[data-app="espir"]{--accent:#83e3d1;--display:"Avenir Next","Trebuchet MS",sans-serif;--title-weight:500;--title-tracking:-.05em;--example-bg:#0c1717;--border:#24403c;--slide-x:-18.63%;--slide-y:-30.35%;--slide-w:137.89%;--slide-h:138.73%}
body[data-app="bookroom"]{--accent:#e2be80;--display:Palatino,"Palatino Linotype",Georgia,serif;--title-weight:400;--example-bg:#18140e;--border:#3a3024}
body[data-app="rpg-dice-bag"]{--accent:#e8ab78;--display:"American Typewriter",Rockwell,Georgia,serif;--title-weight:700;--title-tracking:-.04em;--example-bg:#1a120d;--border:#412b20}
body[data-app="hexa-timer"]{--accent:#a9c2ff;--display:"Helvetica Neue",Helvetica,Arial,sans-serif;--title-weight:750;--title-tracking:-.065em;--example-bg:#101522;--border:#293650}
body[data-app="stoic-day"]{--accent:#e8cf8a;--display:Baskerville,"Times New Roman",serif;--title-weight:400;--title-tracking:-.04em;--example-bg:#17150e;--border:#39331e}
body[data-app] .product h1{font-family:var(--display);font-size:clamp(2.65rem,6.1vw,5.55rem);font-weight:var(--title-weight);letter-spacing:var(--title-tracking);line-height:.96;text-transform:var(--title-case);text-wrap:balance}
body[data-app] .examples h2{font-family:var(--display);font-weight:var(--title-weight)}
body[data-app] .product-icon{border-color:var(--border)}
body[data-app] .examples li{background:var(--example-bg)}
body[data-app] .download{color:var(--cta-ink)}
body[data-app] .download:hover{background:var(--accent);filter:brightness(1.12)}
.phone-frame{
  position:relative;
  width:min(310px,94%);
  padding:7px;
  border:1px solid #686b72;
  border-radius:17% / 8.3%;
  background:linear-gradient(145deg,#7c8087 0%,#2c3037 13%,#181b20 43%,#292c33 72%,#666a73 100%);
  box-shadow:inset 0 0 0 1px #ffffff22,0 12px 32px #ffffff0b;
}
.phone-frame::before,.phone-frame::after{content:"";position:absolute;width:2px;border-radius:2px;background:#646873}
.phone-frame::before{left:-3px;top:21%;height:6%;box-shadow:0 45px #646873}
.phone-frame::after{right:-3px;top:28%;height:9%}
.phone-frame .screens{width:100%;aspect-ratio:var(--screen-ratio,1206/2622);border-radius:15.5% / 7.35%;background:#08090b}
.screen-slide{position:absolute;inset:0;overflow:hidden}
.screen-slide[hidden]{display:none}
.screens .screen-slide img{left:var(--slide-x,0%);top:var(--slide-y,0%);width:var(--slide-w,100%);height:var(--slide-h,100%);clip-path:none;object-fit:fill}
/* Older site captures already contain a device shell. Show only their display. */
.phone-frame .screens[data-framed]{--slide-x:-4.82%;--slide-y:-2.04%;--slide-w:109.65%;--slide-h:104.17%}
@media(max-width:670px){.phone-frame{width:min(288px,92%);padding:6px}}

/* Keep navigation in the footer, away from the product hero. */
.senetus-footer{flex-direction:column;align-items:center;gap:4px}
.senetus-footer .languages a{display:grid;place-items:center;min-width:36px;min-height:32px;font-size:.68rem;font-weight:600;text-decoration:none}
.senetus-footer .languages [aria-current="page"]{color:var(--accent)}
.carousel-pause{position:absolute;right:14px;bottom:22px;display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff55;border-radius:50%;background:#151515eb;color:#f4f4f5;cursor:pointer}
.carousel-pause[hidden]{display:none}
.carousel-pause:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.carousel-pause .play-icon,.carousel-pause[aria-pressed="true"] .pause-icon{display:none}
.carousel-pause[aria-pressed="true"] .play-icon{display:block}
@media(hover:hover){.carousel-pause{opacity:0}.phone-frame:hover .carousel-pause,.carousel-pause:focus-visible,.carousel-pause[aria-pressed="true"]{opacity:1}}