/* Web interpretation of Liquid Glass: a functional layer above the editorial films. */
:root{--glass-fill:rgba(23,35,54,.68);--glass-edge:rgba(220,236,255,.25);--glass-light:rgba(255,255,255,.48);--glass-depth:0 8px 22px rgba(0,9,28,.22);--glass-blur:blur(22px) saturate(1.65);--glass-glint-x:45%}
.showcase-shell{box-shadow:inset 0 1px 0 rgba(224,239,255,.28),inset 0 -1px 0 rgba(190,214,255,.1),0 32px 70px rgba(0,7,25,.4)}
.product-pills,.showcase-actions,.scene-arrows button,.condition-circles button,.next-preview,.review-badge,.advisor-row select,.back-top{
 background:radial-gradient(ellipse at var(--glass-glint-x) 0%,rgba(235,247,255,.16),transparent 68%),linear-gradient(150deg,rgba(152,186,232,.14),rgba(25,40,62,.08) 45%,rgba(9,20,37,.19)),var(--glass-fill);
 border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.27),inset 0 -1px 0 rgba(177,209,255,.07),var(--glass-depth);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur)
}
.product-pills{padding:6px;isolation:isolate;background-color:rgba(17,28,45,.72)}
.product-pills button{position:relative;z-index:1;color:#e0eaff;transition:color 180ms,background-color 180ms,transform 180ms;box-shadow:none}
.product-pills button:hover{color:#fff;background:rgba(229,242,255,.09)}
.product-pills button[aria-selected=true],.product-pills button[aria-selected=true]:hover{color:#fff;background:linear-gradient(145deg,rgba(240,248,255,.29),rgba(205,226,255,.13));box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(210,230,255,.14)}
.product-pills.glass-ready button[aria-selected=true],.product-pills.glass-ready button[aria-selected=true]:hover{background:transparent;box-shadow:none}
.product-pills button:active{transform:scale(.96)}
.glass-selection{position:absolute;z-index:0;top:0;left:0;pointer-events:none;border-radius:999px;width:var(--glass-lens-width,0px);height:var(--glass-lens-height,0px);transform:translate3d(var(--glass-lens-x,0px),var(--glass-lens-y,0px),0);background:radial-gradient(ellipse at 27% 0%,rgba(255,255,255,.24),transparent 65%),linear-gradient(145deg,rgba(226,242,255,.24),rgba(151,186,230,.13));box-shadow:inset 0 1px 0 rgba(255,255,255,.64),inset 1px 0 0 rgba(235,248,255,.17),inset 0 -1px 0 rgba(200,225,255,.18),0 3px 10px rgba(0,8,28,.2);transition:transform 480ms cubic-bezier(.2,.85,.2,1),width 400ms var(--ease),height 400ms var(--ease);will-change:transform}
.showcase-actions{border-radius:999px;padding:3px;gap:0}
.showcase-actions .motion-toggle,.showcase-actions .about-link{border-radius:50%;color:#f3f7ff}
.showcase-actions .motion-toggle:hover,.showcase-actions .about-link:hover{background:rgba(218,237,255,.12)}
.about-link svg{color:inherit}
.scene-arrows button{width:38px;height:38px;color:#eef5ff;transition:transform 180ms,background-color 180ms,box-shadow 180ms}
.scene-arrows button:hover{background-color:rgba(77,117,187,.65);transform:translateY(-2px)}
.condition-circles button{color:#f0f6ff}
.condition-circles button[aria-pressed=true]{background:linear-gradient(145deg,rgba(255,255,255,.93),rgba(224,238,255,.65));color:#142139;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(224,238,255,.5),0 5px 15px rgba(0,9,30,.23)}
.showcase-cta{border:1px solid rgba(255,255,255,.7);background:radial-gradient(ellipse at var(--glass-glint-x) 0%,rgba(255,255,255,.8),transparent 68%),linear-gradient(145deg,rgba(248,253,255,.9),rgba(214,232,255,.65));color:#10213b;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(255,255,255,.48),0 8px 24px rgba(0,10,35,.2);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5)}
.showcase-cta:hover{background-color:rgba(239,248,255,.95);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(255,255,255,.64),0 11px 30px rgba(0,10,35,.26)}
.showcase-cta:active,.next-preview:active{transform:translateY(0) scale(.98)}
.next-preview{border-radius:18px;padding:8px 10px 8px 3px;color:#f3f7ff}
.next-preview:hover{background-color:rgba(52,79,119,.76)}
.next-preview small{color:#d3e0f3}
.review-badge{background-color:rgba(18,31,52,.82);border-radius:999px;color:#edf4ff}
.advisor-row select{border-radius:16px;color:#f1f6ff;background-color:rgba(22,35,55,.85)}
.advisor-row select option{background:#172337;color:#fff}
.advisor-row .button-primary{border-radius:999px;border:1px solid rgba(170,202,255,.58);background:radial-gradient(ellipse at var(--glass-glint-x) 0%,rgba(172,207,255,.34),transparent 65%),linear-gradient(150deg,rgba(72,119,231,.94),rgba(32,71,172,.85));box-shadow:inset 0 1px 0 rgba(221,238,255,.65),inset 0 -1px 0 rgba(168,200,255,.16),0 9px 24px rgba(7,24,66,.2);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4)}
.back-top{border-radius:999px;padding:9px 14px;color:#e3eeff}
/* A light, readable material for the explanatory category controls. */
.curation{background:radial-gradient(ellipse at 15% 75%,rgba(130,172,244,.17),transparent 58%),linear-gradient(145deg,#f6f8fc,#eaf0f9)}
.condition-panel{border:1px solid rgba(255,255,255,.85);background:linear-gradient(140deg,rgba(255,255,255,.86),rgba(255,255,255,.5));box-shadow:inset 0 1px 0 #fff,0 12px 32px rgba(56,83,126,.09);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2)}
.condition-tabs{border-radius:999px;border:1px solid rgba(255,255,255,.85);background:rgba(200,215,237,.56);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 4px 12px rgba(60,85,125,.07);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}
.condition-tabs button{border-radius:999px;color:#354660}
.condition-tabs button[aria-selected=true]{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,251,255,.76));color:#172b48;box-shadow:inset 0 1px 0 #fff,0 3px 8px rgba(38,64,104,.12)}
@media(max-width:760px){:root{--glass-blur:blur(16px) saturate(1.5)}.showcase-actions{padding:2px}.scene-arrows button{width:40px;height:40px}.product-pills{padding:5px}.next-preview{border-radius:16px}.review-badge{font-size:10px}.back-top{padding:8px 12px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.product-pills,.showcase-actions,.scene-arrows button,.condition-circles button,.next-preview,.review-badge,.advisor-row select,.back-top{background-color:#20314b}.showcase-cta{background-color:#e4efff}.condition-panel{background:#fff}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.product-pills,.showcase-actions,.scene-arrows button,.condition-circles button,.next-preview,.review-badge,.advisor-row select,.back-top{background:#20314b;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}.glass-selection{background:#dceaff;box-shadow:none}.product-pills button[aria-selected=true],.product-pills button[aria-selected=true]:hover{color:#11203a}.showcase-cta,.condition-circles button[aria-pressed=true]{background:#e6f0ff;color:#10213b;backdrop-filter:none;-webkit-backdrop-filter:none}.condition-panel{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){.glass-selection,.product-pills button,.scene-arrows button,.showcase-cta,.next-preview{transition:none}}
.motion-paused .glass-selection{transition:none}

/* Reuse is restricted to logos and the generated abstract background. */
.contact{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;margin-top:38px;margin-bottom:38px;min-height:620px}
.contact::before{content:"";position:absolute;z-index:-1;inset:-28px 0;background:linear-gradient(90deg,rgba(11,13,16,.99) 0%,rgba(11,13,16,.92) 33%,rgba(11,13,16,.46) 68%,rgba(11,13,16,.24)),url('/assets/iflip-silver-legacy.webp') center/cover;transform:translate3d(0,var(--ambient-shift,0px),0) scale(1.04);pointer-events:none}
.brand-atmosphere{display:grid;place-items:center;min-height:360px;position:relative}
.brand-atmosphere img{width:220px;height:auto;filter:drop-shadow(0 8px 26px rgba(0,6,20,.3))}
@media(max-width:760px){.contact{min-height:0;margin:0;border-radius:0}.contact::before{background:linear-gradient(180deg,rgba(11,13,16,.98),rgba(11,13,16,.86) 45%,rgba(11,13,16,.28)),url('/assets/iflip-silver-legacy.webp') 62% center/cover}.brand-atmosphere{min-height:220px}.brand-atmosphere img{width:170px}}

@media(max-width:760px){.showcase-header{min-height:186px}.product-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:3px}.product-pills button{flex:0 0 calc((100% - 6px)/3)}}

.showcase-shell[data-family="mac-mini"] .showcase-media{opacity:.32}.showcase-shell[data-family="mac-mini"] .product-scene>img,.showcase-shell[data-family="mac-mini"] .product-scene>video{object-position:center 61%}
@media(max-width:760px){.showcase-shell[data-family="mac-mini"] .showcase-media{opacity:.28}}

/* Editorial detail: a quiet close view between the introduction and comparison. */
.curation-detail{margin:0 0 48px;position:relative}
.curation-detail-visual{position:relative;aspect-ratio:3/1;overflow:hidden;mix-blend-mode:multiply}
.curation-detail img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center;background:transparent;filter:brightness(1.025);transform:translate3d(-6px,3px,0) scale(1.015);animation:detail-drift 20s ease-in-out infinite alternate;animation-play-state:paused}
.curation-detail.has-detail-motion img{animation-play-state:running;will-change:transform}
@keyframes detail-drift{from{transform:translate3d(-6px,3px,0) scale(1.015)}to{transform:translate3d(6px,-3px,0) scale(1.04)}}
.curation-detail figcaption{margin-top:10px;text-align:right;font:11px/1.5 Inter,sans-serif;color:#526075}
.curation-detail a{color:inherit;text-underline-offset:3px}
.curation-detail a:hover{color:#254fb5}
@media(max-width:760px){.curation-detail{margin-bottom:32px}.curation-detail-visual{aspect-ratio:1.65/1}.curation-detail img{animation-duration:26s}}

/* The light stays fixed over the image; only the silver material breathes. */
.contact::before{background:linear-gradient(90deg,rgba(11,13,16,.99) 0%,rgba(11,13,16,.92) 33%,rgba(11,13,16,.46) 68%,rgba(11,13,16,.24));transform:none;will-change:auto}
.contact-ambient{position:absolute;z-index:-2;inset:-28px 0;overflow:hidden;pointer-events:none;transform:translate3d(0,var(--ambient-shift,0px),0)}
.contact-ambient::before{content:"";position:absolute;inset:0;background:url('/assets/iflip-silver-legacy.webp') center/cover;transform:translate3d(-10px,8px,0) scale(1.06) rotate(-.3deg);animation:silver-drift 24s ease-in-out infinite alternate;animation-play-state:paused}
.contact.has-ambient-motion .contact-ambient::before{animation-play-state:running;will-change:transform}
@keyframes silver-drift{from{transform:translate3d(-10px,8px,0) scale(1.06) rotate(-.3deg)}to{transform:translate3d(14px,-10px,0) scale(1.13) rotate(.3deg)}}
@media(max-width:760px){.contact::before{background:linear-gradient(180deg,rgba(11,13,16,.98),rgba(11,13,16,.86) 45%,rgba(11,13,16,.28))}.contact-ambient::before{background-position:62% center;animation-duration:32s}}
@media(prefers-reduced-motion:reduce){.contact-ambient,.contact-ambient::before{transform:none;animation:none;will-change:auto}}
.motion-paused .contact-ambient,.motion-paused .contact-ambient::before{transform:none;animation:none;will-change:auto}

@media(prefers-reduced-motion:reduce){.curation-detail img{animation:none;transform:none;will-change:auto}}
.motion-paused .curation-detail img{animation:none;transform:none;will-change:auto}

/* The two real product profiles float independently; typography never moves. */
.detail-slice{position:absolute;inset:0;opacity:0;pointer-events:none;animation-duration:5.5s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;animation-play-state:paused;animation-delay:-1.5s}
.detail-slice-upper{clip-path:inset(0 0 50% 0);animation-name:macbook-upper-float}
.detail-slice-lower{clip-path:inset(50% 0 0 0);animation-name:macbook-lower-float;animation-duration:6.4s}
.detail-slice img{animation:none!important;transform:none!important;will-change:auto!important}
.detail-split-ready .curation-detail-visual>img{opacity:0;animation:none;transform:none;will-change:auto}
.detail-split-ready .detail-slice{opacity:1}
.detail-split-ready.has-detail-motion .detail-slice{animation-play-state:running;will-change:transform}
@keyframes macbook-upper-float{from{transform:translate3d(-24px,8px,0) rotate(-.25deg)}to{transform:translate3d(24px,-12px,0) rotate(.25deg)}}
@keyframes macbook-lower-float{from{transform:translate3d(24px,-8px,0) rotate(.2deg)}to{transform:translate3d(-24px,12px,0) rotate(-.2deg)}}
@media(max-width:760px){.detail-slice-upper{animation-name:macbook-upper-mobile}.detail-slice-lower{animation-name:macbook-lower-mobile}}
@keyframes macbook-upper-mobile{from{transform:translate3d(-12px,4px,0)}to{transform:translate3d(12px,-5px,0)}}
@keyframes macbook-lower-mobile{from{transform:translate3d(12px,-4px,0)}to{transform:translate3d(-12px,5px,0)}}

/* GPU flow displaces the existing artwork; CSS keeps a moving fallback. */
.silver-flow-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.contact.flow-ready .silver-flow-canvas{opacity:1}
.contact.flow-ready .contact-ambient::before{opacity:0;animation:none;will-change:auto}
.contact-ambient::before{animation-duration:8s}
@keyframes silver-drift{from{transform:translate3d(-30px,18px,0) scale(1.07) rotate(-.7deg)}to{transform:translate3d(30px,-18px,0) scale(1.16) rotate(.7deg)}}
@media(max-width:760px){.contact-ambient::before{animation-duration:10s}}
@media(prefers-reduced-motion:reduce){.detail-split-ready .curation-detail-visual>img{opacity:1}.detail-split-ready .detail-slice{opacity:0;animation:none;will-change:auto}.contact.flow-ready .silver-flow-canvas{opacity:0}.contact.flow-ready .contact-ambient::before{opacity:1}}
.motion-paused .detail-split-ready .curation-detail-visual>img{opacity:1}
.motion-paused .detail-split-ready .detail-slice{opacity:0;animation:none;will-change:auto}
.motion-paused .contact.flow-ready .silver-flow-canvas{opacity:0}
.motion-paused .contact.flow-ready .contact-ambient::before{opacity:1}

/* Confirmed service information stays with the consultation channel. */
.service-details{max-width:470px;margin-top:30px;padding-top:24px;border-top:1px solid rgba(212,227,248,.2)}
.service-details h3{font:600 18px/1.35 Manrope,sans-serif;letter-spacing:-.02em;color:#f3f7ff;margin:0 0 12px}
.service-details p{font:13px/1.7 Inter,sans-serif;color:#d2dce9;margin:0}
.service-details p+p{margin-top:10px;font-size:12px;color:#bdccdf}
.footer-bottom{flex-wrap:wrap}
.company-id{white-space:nowrap}
@media(max-width:760px){.service-details{margin-top:26px;padding-top:22px}.service-details h3{font-size:17px}}

.service-details p.payment-options{font-size:13px;color:#d2dce9;margin-top:16px}
@media(max-width:760px){.contact::before{background:linear-gradient(180deg,rgba(11,13,16,.98) 0%,rgba(11,13,16,.92) 65%,rgba(11,13,16,.35) 100%)}}

/* Launch clarity: readable preference labels and comfortable primary targets. */
.product-pills button{min-height:44px}
.showcase-actions .motion-toggle,.showcase-actions .about-link,.scene-arrows button{width:44px;height:44px;min-width:44px;min-height:44px}
.showcase-cta{min-height:48px}
.condition-circles{gap:10px}
.condition-circles button{width:44px;height:44px;min-width:44px;min-height:44px;font-size:10px;line-height:1.1;white-space:normal}
.showcase-options{width:165px}
.availability>span,.condition-choice legend,#condition-summary{color:#d0dbeb}
.showcase-copy>p{color:#d6dfec}
.editorial-credit{font-size:11px;min-height:24px;display:inline-flex;align-items:center;bottom:8px}
.phone-number,.footer-bottom a{min-height:44px;display:inline-flex;align-items:center}
.back-top{min-height:44px}
@media(max-width:760px){.showcase-header{min-height:168px}.product-pills{gap:4px;padding:6px}.product-pills button{flex-basis:calc((100% - 8px)/3);min-height:44px}.showcase-options{width:auto}.showcase-shell[data-family]::after{background:linear-gradient(180deg,rgba(20,23,28,.9),rgba(20,23,28,.82) 45%,rgba(20,23,28,.35) 60%,rgba(20,23,28,.88) 75%,rgba(20,23,28,.95))}}
@media(max-width:360px){.showcase-options{grid-template-columns:1fr;gap:24px}.condition-choice,.condition-choice legend{text-align:left}.condition-circles{justify-content:flex-start}#condition-summary{text-align:left}}