/* Home and app-specific compositions; shared tokens/components are in site.css. */
/* The original mascot remains the studio's opening image. */
.refresh-page .home-hero { display:flex; min-height:410px; }
.refresh-page .home-hero::before { display:none; }
.refresh-page .hero-copy { width:54%; padding:56px 28px 56px max(24px,calc((100vw - var(--content))/2)); }
.refresh-page .hero-copy h1 { font-size:clamp(34px,3.5vw,50px); }
.refresh-page .hero-copy h1 span { white-space:normal; }
.refresh-page .hero-copy > p { max-width:440px; font-size:16px; line-height:1.65; }
.refresh-page .hero-visual { position:absolute; min-height:0; }
.refresh-page .hero-monkey { width:66%; object-position:72% center; }
/* Catalog: two self-contained app presentations, rather than full-width banners. */
.app-catalog { padding-block:44px; }
.fresh-products { display:grid; grid-template-columns:1fr; gap:20px; }
.fresh-heading { margin:0 0 24px; }
.fresh-heading h2 { margin:0; font-size:clamp(26px,2.8vw,36px); line-height:1.15; }
.fresh-heading > p { max-width:54ch; margin:12px 0 0; color:var(--fresh-muted); font-size:15px; line-height:1.65; }
.fresh-products > .fresh-heading { grid-column:1/-1; display:flex; align-items:baseline; justify-content:space-between; gap:24px; margin:0 0 4px; }
.fresh-products > .fresh-heading > p { max-width:48ch; margin:0; font-size:14px; }
.fresh-product { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:20px; padding:24px; border-radius:14px; min-width:0; }
.weather-product { background:var(--catalog-surface); color:var(--fresh-ink); }
.planner-product { background:var(--catalog-surface); color:var(--fresh-ink); }
.card-copy { min-width:0; }
.fresh-product .button-light:hover { background:var(--fresh-paper); }
.fresh-product .store-badge img { width:auto; height:44px; }
.refresh-page .product-identity { display:flex; align-items:center; gap:12px; margin:0 0 20px; }
.refresh-page .product-identity .app-icon { width:44px; height:44px; border-radius:11px; box-shadow:none; flex-shrink:0; }
.refresh-page .product-identity p { margin:0 0 2px; font-size:12px; line-height:1.5; font-weight:400; }
.refresh-page .product-identity strong { display:block; font-size:19px; line-height:1.3; }
.weather-product .product-identity p,.weather-product .card-copy > p { color:var(--fresh-muted); }
.planner-product .product-identity p,.planner-product .card-copy > p { color:var(--fresh-muted); }
.fresh-product h3 { margin:0 0 12px; font-size:24px; line-height:1.2; }
.card-copy > p { margin:0; font-size:14px; line-height:1.65; max-width:46ch; }
.fresh-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:20px; }
.card-screens { display:flex; align-items:flex-start; justify-content:center; gap:12px; min-width:0; }
.card-screens figure { margin:0; flex:0 0 auto; width:calc(var(--phone-height,240px)*660/1434); }
.card-screens img { display:block; width:100%; height:var(--phone-height,240px); object-fit:contain; border-radius:12px; }
.card-screens figcaption { margin-top:8px; font-size:12px; line-height:1.4; text-align:center; }
.weather-product figcaption { color:var(--fresh-muted); }
.planner-product figcaption { color:var(--fresh-muted); }
/* Product introductions: copy and two aligned, bounded iPhone screens. */
.product-opening,.planner-opening { width:min(var(--content),calc(100% - 48px)); margin:24px auto 0; padding:28px; border-radius:14px; background:var(--catalog-surface); }
.refresh-page .hero-grid { width:100%; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(240px,.9fr); align-items:center; gap:40px; padding:0; border-radius:0; }
.product-opening .hero-grid,.planner-opening .hero-grid { background:transparent; color:var(--fresh-ink); }
.fresh-copy { min-width:0; }
.fresh-copy h1 { margin:0; font-size:32px; line-height:1.12; }
.refresh-page .fresh-copy .product-identity { margin-bottom:16px; }
.refresh-page .fresh-copy .product-identity .app-icon { width:56px; height:56px; border-radius:14px; }
.fresh-copy h1 em { font-style:normal; color:inherit; }
.fresh-copy > p { max-width:60ch; margin:0; font-size:15px; line-height:1.7; color:var(--fresh-muted); }
.hero-screens { --phone-height:240px; gap:16px; }
.fresh-copy .fresh-actions { margin-top:16px; }
.fresh-copy .fresh-link:hover { background:var(--fresh-paper); }
.fresh-copy .store-badge img,.download-panel .store-badge img { height:44px; width:auto; }
.product-page .fresh-heading h2 { font-size:26px; }
.fresh-link:hover { text-decoration:none; }
.refresh-page .availability { margin-top:12px; font-size:12px; line-height:1.6; }
.fresh-facts { width:100%; margin:24px 0 0; }
.fresh-facts > .wrap { width:100%; display:grid; grid-template-columns:repeat(4,1fr); }
.fresh-facts p { margin:0; padding:0 12px; }
.fresh-facts p:first-child { padding-inline-start:0; }
.fresh-facts strong,.fresh-facts span { display:block; }
.fresh-facts strong { font-size:12px; }
.fresh-facts span { font-size:12px; color:var(--fresh-muted); margin-top:4px; }
.fresh-section { padding-block:36px; }
.fresh-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin:24px 0 28px; }
.fresh-benefits article { padding-top:16px; }
.fresh-benefits h3 { font-size:18px; line-height:1.35; margin:0 0 10px; }
.fresh-benefits p { color:var(--fresh-muted); font-size:14px; line-height:1.7; margin:0; }
/* Small full screenshots can be opened for close inspection. */
.refresh-page .fresh-gallery { display:flex; flex-wrap:wrap; justify-content:center; --shot-height:220px; gap:20px; padding:8px 0; }
.fresh-gallery figure { margin:0; width:calc(var(--shot-height)*660/1434); flex:0 0 auto; }
.fresh-gallery img { width:100%; height:var(--shot-height); object-fit:contain; border-radius:12px; }
.fresh-gallery figcaption { padding-top:10px; }
.fresh-gallery strong { display:block; font-size:12px; line-height:1.4; }
.fresh-gallery figcaption span { display:none; }
.screenshot-thumb { display:block; cursor:zoom-in; border-radius:12px; }
.tablet-section { width:min(var(--content),calc(100% - 48px)); margin:auto; }
.tablet-section > .wrap { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:24px 32px; align-items:center; padding:28px; border-radius:14px; background:var(--catalog-surface); }
.tablet-section .fresh-heading { margin:0; }
.tablet-screen { width:100%; height:auto; border-radius:10px; }
.tablet-section .fresh-actions { grid-column:1/-1; margin:0; }
.fresh-faq { display:grid; gap:8px; margin-block:24px; }
.fresh-faq details { padding-inline:16px; border-radius:8px; background:var(--catalog-surface); }
.fresh-faq summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; cursor:pointer; padding-block:16px; font-weight:800; font-size:14px; list-style:none; }
.fresh-faq summary::-webkit-details-marker { display:none; }
.fresh-faq summary::after { content:""; flex:0 0 12px; width:12px; height:12px; background:linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,linear-gradient(currentColor,currentColor) center/2px 12px no-repeat; }
.fresh-faq details[open] summary::after { background:linear-gradient(currentColor,currentColor) center/12px 2px no-repeat; }
.fresh-faq p { max-width:75ch; margin:0; padding-bottom:20px; font-size:14px; line-height:1.8; color:var(--fresh-muted); }
.plan-comparison { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:28px; }
.plan-comparison article { padding:24px; border:0; border-radius:14px; background:var(--catalog-surface); }
.plan-comparison h3 { margin:0; font-size:20px; }
.plan-comparison .feature-list { margin-block:20px; }
.plan-comparison .feature-list li { font-size:13px; font-weight:400; color:var(--fresh-ink); }
.plan-comparison .feature-list li::before { color:var(--fresh-muted); }
.plan-comparison article > p:last-child { font-size:12px; line-height:1.7; color:var(--fresh-muted); }
.refresh-page .product-note { max-width:90ch; margin:24px 0 0; padding:0; border:0; background:transparent; color:var(--fresh-muted); font-size:12px; line-height:1.8; }
/* Questions, limitations and download form one end-of-page decision area. */
.product-help { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:32px; align-items:start; padding-block:36px; }
.help-questions h2 { margin:0 0 16px; font-size:26px; line-height:1.2; }
.product-help .fresh-faq { margin:0; }
.product-help .product-note { margin-top:14px; max-width:68ch; line-height:1.6; }
.download-panel { padding:24px; border-radius:14px; background:var(--catalog-surface); }
.download-identity { display:flex; align-items:center; gap:12px; }
.download-identity img { width:44px; height:44px; border-radius:11px; }
.download-identity h3 { margin:0; font-size:20px; line-height:1.3; }
.download-panel p { margin:16px 0; color:var(--fresh-muted); font-size:14px; line-height:1.65; }
/* Secondary apps stay inside the catalog; the studio is the next distinct group. */
.refresh-page .more-apps { padding:28px 0 0; background:transparent; }
.refresh-page .more-apps .section-heading { margin-bottom:18px; }
.more-apps .section-heading h3 { margin:0; font-size:20px; line-height:1.3; }
.more-apps .app-grid { gap:28px; }
.refresh-page .app-card { display:grid; grid-template-rows:auto 1fr auto; gap:12px; background:transparent; border:0; box-shadow:none; border-radius:0; min-height:0; padding:0; }
.app-identity { display:flex; align-items:center; gap:12px; }
.refresh-page .app-card .app-icon { width:44px; height:44px; box-shadow:none; border-radius:11px; }
.app-identity h4 { margin:0; font-size:18px; font-weight:800; line-height:1.3; letter-spacing:-.02em; }
.app-identity p { margin:3px 0 0; color:var(--fresh-muted); font-size:12px; }
.refresh-page .app-card > p { margin:0; font-size:14px; line-height:1.65; color:var(--fresh-muted); }
.refresh-page .app-card .text-link { min-height:44px; margin:0; font-size:13px; color:var(--fresh-ink); }
.refresh-page .studio-contact { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr); gap:48px; align-items:start; padding:28px; margin-bottom:44px; border-radius:14px; background:var(--catalog-surface); }
.studio-contact h2 { margin:0; font-size:26px; line-height:1.2; }
.studio-contact h3 { margin:0; font-size:20px; line-height:1.3; }
.studio-contact p { margin:12px 0 0; font-size:14px; line-height:1.75; color:var(--fresh-muted); max-width:58ch; }
.studio-help .button { margin-top:16px; }
.shot-dialog { overscroll-behavior:contain; width:fit-content; max-width:min(92vw,640px); max-height:94svh; padding:16px; border:1px solid #49615c; border-radius:14px; background:#f6f6f2; color:#17282e; }
.shot-dialog::backdrop { background:#07151bce; }
.shot-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:12px; }
.shot-dialog-header h2 { margin:0; font-size:16px; }
.shot-dialog-close { min-width:44px; min-height:44px; border:1px solid #ccd5ce; border-radius:7px; background:transparent; color:#17282e; font:inherit; cursor:pointer; }
.shot-dialog > img { display:block; width:auto; max-width:100%; height:auto; max-height:68svh; margin-inline:auto; object-fit:contain; border-radius:10px; }
.shot-dialog > p { max-width:440px; font-size:13px; line-height:1.6; margin:12px 0 0; }
@media (min-width:1140px) {
 .fresh-products { grid-template-columns:1fr 1fr; }
 .fresh-product { grid-row:span 4; grid-template-rows:subgrid; align-items:start; column-gap:20px; row-gap:16px; padding:24px; }
 .fresh-product .card-copy { display:contents; }
 .fresh-product .card-copy > * { grid-column:1; }
 .fresh-product .product-identity,.fresh-product h3,.fresh-product .fresh-actions { margin:0; }
 .fresh-product .fresh-actions { grid-column:1/-1; grid-row:4; align-self:end; }
 .fresh-product .card-screens { grid-column:2; grid-row:1/4; align-self:center; }
 .fresh-product .card-screens { --phone-height:220px; gap:10px; }
 .fresh-product h3 { font-size:23px; }
 .fresh-product .product-identity p { max-width:24ch; }
 .fresh-product .fresh-actions { gap:10px; }
 .fresh-product .button { font-size:12px; padding-inline:12px; }
 .fresh-product .store-badge img { width:auto; height:44px; }
}
@media (max-width:759px) {
 .refresh-page .wrap,.product-opening,.planner-opening,.tablet-section { width:calc(100% - 32px); }
 .refresh-page .home-hero { display:grid; min-height:0; }
 .refresh-page .hero-copy { width:100%; padding:32px 24px 20px; }
 .refresh-page .hero-copy h1 { font-size:34px; }
 .refresh-page .hero-copy > p { max-width:48ch; font-size:15px; }
 .refresh-page .hero-visual { position:relative; inset:auto; height:230px; }
 .refresh-page .hero-monkey { width:100%; object-position:70% 40%; mask-image:none; -webkit-mask-image:none; }
 .refresh-page .hero-visual::before { display:none; }
 .app-catalog { padding-block:28px; }
 .fresh-products { gap:16px; }
 .refresh-page .studio-contact { grid-template-columns:1fr; gap:28px; padding:24px; margin-bottom:28px; }
 .more-apps .app-grid { gap:24px; }
 .fresh-products > .fresh-heading { display:block; }
 .fresh-products > .fresh-heading > p { margin-top:10px; }
 .fresh-product { padding:24px; gap:24px; grid-template-columns:1fr; }
 .fresh-product .product-identity { margin-bottom:16px; }
 .fresh-product .card-screens { --phone-height:200px; gap:16px; }
 .fresh-product h3 { font-size:24px; }
 .fresh-product .fresh-actions { margin-top:16px; }
 .product-opening,.planner-opening { margin-top:16px; padding:20px; }
 .refresh-page .hero-grid { width:100%; padding:0; gap:24px; grid-template-columns:1fr; }
 .fresh-facts > .wrap,.tablet-section > .wrap { width:100%; }
 .fresh-copy h1 { font-size:28px; }
 .refresh-page .fresh-copy .product-identity .app-icon { width:48px; height:48px; border-radius:12px; }
 .hero-screens { --phone-height:180px; gap:16px; }
 .fresh-facts > .wrap { grid-template-columns:1fr 1fr; }
 .fresh-facts p { padding:0 8px; }
 .fresh-facts > .wrap { row-gap:16px; }
 .fresh-facts p:nth-child(odd) { padding-inline-start:0; }
 .fresh-section { padding-block:28px; }
 .fresh-benefits { grid-template-columns:1fr; gap:20px; }
 .refresh-page .fresh-gallery { --shot-height:180px; gap:16px; }
 .tablet-section > .wrap { grid-template-columns:1fr; padding:24px; }
 .plan-comparison { grid-template-columns:1fr; }
 .product-help { grid-template-columns:1fr; gap:24px; padding-block:28px; }
}