/* Static format showcase: no fake links, buttons or hidden content. */
.product-format-gallery{margin-top:25px}
.product-format-card{cursor:default;transition:background .22s,border-color .22s,color .22s}
.product-format-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:17px 4px 8px;min-width:0}
.product-format-title h4{font-size:20px;font-weight:500;line-height:1.2;letter-spacing:-.025em;min-width:0}
.product-format-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#ffffff0c;color:var(--format-color);border:1px solid #ffffff12;flex-shrink:0}
.product-format-icon svg{width:21px;height:21px}
.product-format-hint{margin:0 4px 6px;min-height:36px;line-height:1.5}
.product-format-card-video{--format-color:#a2b2ff}.product-format-card-article{--format-color:#94d9e2}.product-format-card-memo{--format-color:#c1e394}.product-format-card-test{--format-color:#c5b3fa}.product-format-card-quest{--format-color:#ffbe9e}.product-format-card-chat{--format-color:#94d9e2}.product-format-card-game{--format-color:#a2b2ff}.product-format-card-ai{--format-color:#c5b3fa}
@media(hover:hover){.product-format-card:hover{background:var(--format-color);border-color:var(--format-color);color:#162136}.product-format-card:hover .product-format-hint{color:#34415b}.product-format-card:hover .product-format-icon{color:#243658;background:#ffffff50;border-color:#ffffff40}}
.product-footer{justify-content:flex-end}
.product-hero-visual{width:112%;margin-left:-6%}
.product-hero-scene{pointer-events:auto}
.product-hero-scene>img{mask-image:linear-gradient(90deg,transparent,#000 9%,#000 97%,transparent)}
.product-hero-scene:after{background:linear-gradient(#13161c 0,transparent 14%,transparent 88%,#13161c)}
.cycle-ribbon{width:78%;height:390px;justify-content:center}
.cycle-sculpture{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 32px #2c79ff2b)}
.cycle-centre{top:auto;bottom:0;left:50%;transform:translateX(-50%);width:auto;height:auto;white-space:nowrap;background:transparent;border:none;border-radius:0;box-shadow:none;gap:2px}
.cycle-centre>span{font-size:20px;color:#dcecff}.cycle-centre small{font-size:10px;color:#9fb7d7;margin-top:3px}
.cycle-labels{pointer-events:none}
@media(max-width:1100px){.product-format-title h4{font-size:19px}.product-format-title{gap:7px}.product-format-icon{width:30px;height:30px;border-radius:9px}.product-format-icon svg{width:19px;height:19px}.cycle-ribbon{width:82%;height:360px}}
@media(max-width:900px){.product-hero-visual{width:100%;margin:0 auto}.product-format-title h4{font-size:22px}.product-format-icon{width:36px;height:36px}.product-format-icon svg{width:22px;height:22px}.cycle-ribbon{width:90%}}
@media(max-width:760px){.cycle-ribbon{width:100%;height:230px;padding:0;margin:0 0 20px}.cycle-centre{bottom:0}.cycle-centre>span{font-size:18px}.cycle-centre small{font-size:9px}.product-format-title{margin:15px 2px 8px;gap:6px}.product-format-title h4{font-size:19px}.product-format-icon{width:29px;height:29px;border-radius:8px}.product-format-icon svg{width:18px;height:18px}.product-format-hint{margin-inline:2px;font-size:11px;min-height:34px}.product-footer{align-items:flex-end}.product-format-card{background:linear-gradient(155deg,color-mix(in srgb,var(--format-color) 9%,#1b212c),#1b212c)}}
@media(max-width:390px){.cycle-ribbon{height:195px}.product-format-title h4{font-size:18px}.product-format-card-ai .product-format-title{flex-wrap:wrap}.product-format-card-ai .product-format-icon{margin-left:auto}.product-format-icon{width:27px;height:27px}.product-format-icon svg{width:17px;height:17px}.product-format-hint{font-size:11px}.product-format-title{min-height:29px}}
@media(max-width:350px){.product-format-title h4{font-size:16px}.product-format-icon{width:24px;height:24px}.product-format-icon svg{width:16px;height:16px}.product-format-title{gap:5px}.product-format-title h4{overflow-wrap:normal}.product-format-card-ai .product-format-title{display:block}.product-format-card-ai .product-format-icon{margin:8px 0 0}.cycle-ribbon{height:175px}}
@media(prefers-reduced-motion:reduce){.product-format-card{transition:none}}
/* Keep the format icon aligned beside the title at every width. */
@media(max-width:390px){.product-format-card-ai .product-format-title{display:flex;flex-wrap:nowrap;align-items:flex-start}.product-format-card-ai .product-format-icon{margin:0;flex-shrink:0}.product-format-card-ai .product-format-title h4{overflow-wrap:normal}}