/* inter-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-cyrillic-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* inter-cyrillic-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-cyrillic-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* inter-greek-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-greek-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+1F00-1FFF;
}

/* inter-greek-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-greek-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* inter-vietnamese-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-vietnamese-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* inter-latin-ext-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* inter-latin-wght-normal */
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* Typography like iBox (ibox.co.id uses SF Pro): Apple devices render the native SF Pro;
   other devices get Inter (bundled locally, no CDN) as the closest clean equivalent. */
body,button,input,select,textarea{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Inter Variable",Inter,"Segoe UI",Arial,sans-serif}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"kern" 1}
h1,h2,h3{letter-spacing:-.025em;font-weight:600}
.store-hero h1{letter-spacing:-.03em;font-weight:600}
.eyebrow,.hero-kicker{letter-spacing:.16em}

/* Realistic hero photo (replaces the CSS phone mockup + glow background) */
.hero-photo{position:absolute;inset:0;z-index:0;overflow:hidden}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:right center;display:block;transition:opacity .35s ease}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,11,16,.92) 0%,rgba(9,11,16,.72) 32%,rgba(9,11,16,.15) 62%,rgba(9,11,16,0) 100%)}
.store-hero .hero-bottom{z-index:2}
.store-hero .product-stage{pointer-events:none}

/* Service cards + detail dialog: real photos instead of CSS devices */
.card-product{border-radius:14px;background:#f2f3f5}
.card-product img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}
.store-card:hover .card-product img{transform:scale(1.04)}
.card-product .product-number{z-index:2;color:#fff;opacity:.92;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.detail-product{overflow:hidden;padding:0}
.detail-product img{width:100%;height:100%;object-fit:cover;display:block}

/* IMEI screenshot (*#06#) */
.imei-upload{display:block}
.imei-label{font-size:12px;font-weight:600;color:#34434b;margin:0 0 8px}
.imei-steps{margin:0 0 14px;padding:14px 16px 14px 34px;background:#f5f7fb;border-radius:10px;font-size:12px;color:#34434b;line-height:1.9}
.dial-code{display:inline-block;font-family:inherit;font-weight:700;font-size:14px;letter-spacing:.12em;background:#111418;color:#fff;border-radius:7px;padding:1px 9px}
.imei-preview img{width:56px;height:96px;object-fit:cover}

@media(max-width:760px){
 .hero-photo img{object-position:72% bottom}
 .hero-photo::after{background:linear-gradient(180deg,rgba(9,11,16,.94) 0%,rgba(9,11,16,.75) 38%,rgba(9,11,16,.1) 70%,rgba(9,11,16,.55) 100%)}
}
@media(prefers-reduced-motion:reduce){.hero-photo img,.card-product img{transition:none}}
.card-product .product-number{font-size:58px;letter-spacing:-3px;right:14px;bottom:6px}
.service-1 .card-product .product-number{font-size:34px;letter-spacing:-1.5px;bottom:12px}