/* ============================================================
   Medtoolsource — Figma canvas "medtool source" (577:1560), 1440px canvas.
   Desktop = exact Figma coordinates. 768–1439px = proportional zoom.
   ≤767px = mobile reflow with hamburger menu.
   ============================================================ */

/* ---------- Fonts ---------- */
@font-face { font-family:'Mona Sans'; src:url('../fonts/Mona-Sans-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Mona Sans'; src:url('../fonts/Mona-Sans-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Mona Sans'; src:url('../fonts/Mona-Sans-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
@font-face { font-family:'Mona Sans'; src:url('../fonts/Mona-Sans-Bold.ttf') format('truetype'); font-weight:700; font-display:swap; }
@font-face { font-family:'Manrope'; src:url('../fonts/Manrope-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Manrope'; src:url('../fonts/Manrope-Medium.ttf') format('truetype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Manrope'; src:url('../fonts/Manrope-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
@font-face { font-family:'Manrope'; src:url('../fonts/Manrope-Bold.ttf') format('truetype'); font-weight:700; font-display:swap; }
@font-face { font-family:'Inter Display'; src:url('../fonts/InterDisplay-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Inter Display'; src:url('../fonts/InterDisplay-SemiBold.ttf') format('truetype'); font-weight:600; font-display:swap; }
/* Inter — Google Fonts (variable, latin + latin-ext) */
@font-face { font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('../fonts/Inter-latin-ext.woff2') format('woff2');
  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; }
@font-face { font-family:'Inter'; font-style:normal; font-weight:100 900; font-display:swap;
  src:url('../fonts/Inter-latin.woff2') format('woff2');
  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; }

/* ---------- Base ---------- */
:root{
  --ink:#202327;                    /* headings */
  --body:#17110f;                   /* body copy */
  --blue:#0065f5;                   /* buttons, product names, accents */
  --muted:#464646;                  /* nav + footer links */
  --price:#353535;
  --teal:rgba(1,221,233,.13);       /* soft panels */
  --cardbg:rgba(0,101,245,.1);      /* product card panel */
  --line:#d9d9d9;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{background:#fff}
body{font-family:'Inter Display','Inter',sans-serif;color:var(--body)}
img{display:block}
a{text-decoration:none;color:inherit}
p{margin:0}
button{border:none;background:none;cursor:pointer;font:inherit;padding:0}

.canvas{width:1440px;margin:0 auto;position:relative}
.pg-landing  .canvas{height:5033px}
.pg-products .canvas{height:2831px}
.pg-cart     .canvas{height:1191px}
.pg-contact  .canvas{height:2154px}
.pg-detail   .canvas{height:2493px}
.pg-checkout .canvas{height:3031px}

.el{position:absolute}
.wrap{position:static}
.band{position:absolute;left:50%;transform:translateX(-50%);width:max(1440px,100vw)}

/* ---------- Type ---------- */
.mona{font-family:'Mona Sans',sans-serif;font-weight:700;color:var(--ink)}
.h-80{font-size:80px;line-height:90px;letter-spacing:.8px}
.h-60{font-size:60px;line-height:70px;letter-spacing:.6px}
.h-40{font-size:40px;line-height:45px;letter-spacing:.4px}
.h-40-43{font-size:40px;line-height:43px;letter-spacing:.4px}
.h-40-90{font-size:40px;line-height:90px;letter-spacing:.4px}

.body-18{font-family:'Inter Display','Inter',sans-serif;font-weight:400;font-size:18px;letter-spacing:.18px;color:var(--body);line-height:normal}
.body-16{font-family:'Inter Display','Inter',sans-serif;font-weight:400;font-size:16px;letter-spacing:.16px;color:var(--body);line-height:22px}
.nav-b{font-family:'Inter',sans-serif;font-weight:700;font-size:18px;letter-spacing:.18px;color:var(--muted);line-height:normal;white-space:nowrap}
.link-sb{font-family:'Inter',sans-serif;font-weight:600;font-size:18px;letter-spacing:.18px;color:var(--muted);line-height:normal;white-space:nowrap}

.price-35{font-family:'Mona Sans',sans-serif;font-weight:400;font-size:35px;letter-spacing:.35px;color:var(--price);line-height:90px;white-space:nowrap}
.price-25{font-family:'Mona Sans',sans-serif;font-weight:500;font-size:25px;letter-spacing:.25px;color:var(--price);line-height:90px;white-space:nowrap}

/* ---------- Header (identical on every page) ---------- */
.site-hdr{position:static}
.hdr-logo{top:46px;left:140px;width:91px;height:64px;z-index:42}
.hdr-logo img{width:100%;height:100%;object-fit:contain}
.nav-link{top:64px;z-index:42}
.nav-all{left:844px}
.nav-contact{left:1046px}
.hdr-cart{top:53px;left:1247px;width:54px;height:41px;z-index:42}
.hdr-cart img{width:100%;height:100%;object-fit:contain}
.hdr-line{top:145px;height:1px;background:var(--line)}
.hamburger{display:none}

/* ---------- Buttons ---------- */
.btn-blue{background:var(--blue);border-radius:4px;display:flex;align-items:center;justify-content:center}
.btn-blue .lbl{font-family:'Manrope',sans-serif;font-weight:700;font-size:22px;color:#fff;text-align:center;white-space:nowrap}
.btn-out{border:2px solid var(--blue);border-radius:4px;background:none;display:flex;align-items:center;justify-content:center}
.btn-out .lbl{font-family:'Manrope',sans-serif;font-weight:600;font-size:22px;color:var(--blue);text-align:center;white-space:nowrap}

/* ---------- Product card (shared across pages) ---------- */
.pc-bg{position:absolute;width:375px;height:376px;background:var(--cardbg);border-radius:4px}
.pc-img{position:absolute;width:268px;height:345px;object-fit:contain;top:18px;left:63px}
.pc-name{position:absolute;font-family:'Manrope',sans-serif;font-weight:600;font-size:30px;color:var(--blue);text-align:center;line-height:normal}
.pc-price{position:absolute}
.pc-btn{position:absolute;width:354px;height:73px}

/* ---------- Footer ---------- */
.ftr{
  position:absolute;top:var(--ftr-top);left:0;width:1440px;
  padding:40px 120px 36px;background:#fff;border-top:1px solid var(--line);
  display:flex;flex-direction:column
}
.ftr-top{display:flex;justify-content:space-between;align-items:flex-start;gap:64px}
.ftr-brand{display:flex;flex-direction:column;gap:8px;max-width:520px;flex:1 1 auto}
.ftr-seller{font-family:'Manrope',sans-serif;font-weight:700;font-size:22px;line-height:1.3;color:var(--ink)}
.ftr-addr,.ftr-contact,.ftr-statement{position:static;width:auto;font-size:16px;line-height:1.5;color:var(--muted)}
.ftr-contact{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ftr-contact a{color:var(--blue);text-decoration:underline;text-underline-position:from-font}
.ftr-dot{color:#b5b5b5}
.ftr-statement{margin-top:4px;color:var(--body);font-weight:600}
.ftr-links{
  position:static;top:auto;right:auto;width:auto;max-width:none;
  display:grid;grid-template-columns:max-content max-content;column-gap:40px;row-gap:12px;justify-content:end
}
.ftr-links a{
  position:static;font-family:'Inter',sans-serif;font-weight:600;font-size:15px;letter-spacing:.15px;
  color:var(--muted);line-height:1.35;white-space:nowrap
}
.ftr-links a:hover{color:var(--blue)}
.ftr-line{position:static;width:100%;height:1px;margin:28px 0 18px;background:var(--line)}
.ftr-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px}
.ftr-copy{position:static;width:auto;top:auto;left:auto;font-size:15px;line-height:1.45;color:var(--muted)}
.ftr-cards{position:static;top:auto;left:auto;width:148px;height:32px;object-fit:contain;flex:0 0 auto}

/* ---------- Tag pills + qty stepper (detail / checkout) ---------- */
/* Figma specifies Inter Display Medium here — using Google Inter instead renders ~10%
   wider and pushes the label into (and past) the pill's right edge. */
.tag{position:absolute;height:37px;border:1px solid var(--blue);border-radius:5px;display:flex;align-items:center;
     padding:0 17px;
     font-family:'Inter Display','Inter',sans-serif;font-weight:500;font-size:14px;letter-spacing:.14px;color:var(--blue);line-height:22px;white-space:nowrap}
.selqty{position:absolute;font-family:'Inter Display','Inter',sans-serif;font-weight:500;font-size:14px;letter-spacing:.14px;color:var(--blue);line-height:22px;white-space:nowrap}
.qty-btn{position:absolute;width:49px;height:49px;border-radius:50%;border:1px solid var(--blue);background:none}
.qty-btn .bar-h{position:absolute;left:12px;top:23.5px;width:25px;height:1.5px;background:var(--blue)}
.qty-btn .bar-v{position:absolute;left:23.5px;top:12px;width:1.5px;height:25px;background:var(--blue)}
.qty-num{position:absolute;font-family:'Mona Sans',sans-serif;font-weight:500;font-size:36px;line-height:49px;color:var(--blue);text-align:center}

/* ---------- Form fields (contact + checkout) ---------- */
.field{position:absolute;background:#fff;border:1px solid var(--muted);border-radius:5px;
       font-family:'Inter Display','Inter',sans-serif;font-size:17px;letter-spacing:.17px;color:var(--body);padding:0 28px}
.field::placeholder{color:var(--body);opacity:1}
.field:focus{outline:none;border-color:var(--blue)}
textarea.field{padding-top:24px;resize:none;line-height:1.5}
.cbx{
  appearance:none;-webkit-appearance:none;print-color-adjust:exact;
  width:20px;height:20px;margin:0;padding:0;flex:0 0 20px;
  background:#fff;border:1px solid var(--muted);border-radius:4px;cursor:pointer;
  background-repeat:no-repeat;background-position:center;background-size:12px 12px
}
.cbx:checked{
  border-color:var(--blue);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%230065f5' stroke-width='2.2' d='M2 6.2l2.8 2.8L10 3.2'/%3E%3C/svg%3E")
}
.cbx:focus{outline:2px solid var(--blue);outline-offset:2px}
.ck-check-row,.ck-agree-row{cursor:pointer}
.ck-check-row label,.ck-agree-row label{cursor:pointer}

/* ============================================================
   LANDING
   ============================================================ */
.pg-landing{--ftr-top:4587px}
.ld-hero-img{top:216px;left:712px;width:652px;height:675px;border-radius:5px;object-fit:cover}
.ld-hero-h{top:286px;left:116px;width:593px}
.ld-hero-sub{top:606px;left:117px;width:522px}
.ld-hero-btn{top:708px;left:118px;width:310px;height:73px}
.ld-line16{top:945px;height:1px;background:var(--line)}

.ld-bs-img{top:1091px;left:102px;width:642px;height:624px;border-radius:5px;object-fit:cover}
.ld-bs-title{top:1208px;left:834px;width:447px}
.ld-bs-price{position:absolute;top:1303px;left:840px;width:131px}
.ld-bs-desc{top:1396px;left:840px;width:483px}
.ld-bs-btn{top:1544px;left:837px;width:310px;height:73px}
.ld-line17{top:1855px;height:1px;background:var(--line)}

.ld-sec-h{top:1970px;left:448px;width:535px;text-align:center}
.ld-sec-sub{top:2132px;left:454px;width:467px;text-align:center}

/* product grid — row 1 names are blue+centred, row 2 are ink+left (per Figma) */
.c1-bg{top:2305px;left:99px}   .c1-nm{top:2747px;left:99px;width:166px}   .c1-pr{top:2727px;left:373px;width:95px}  .c1-bt{top:2847px;left:114px}
.c2-bg{top:2305px;left:529px}  .c2-img{left:61px;top:21px;width:269px}    .c2-nm{top:2749px;left:541px;width:219px} .c2-pr{top:2727px;left:813px;width:95px}  .c2-bt{top:2847px;left:535px}
.c3-bg{top:2305px;left:969px}  .c3-img{left:71px;top:21px}                .c3-nm{top:2750px;left:981px;width:206px} .c3-pr{top:2727px;left:1245px;width:95px} .c3-bt{top:2847px;left:983px}
.c4-bg{top:3026px;left:96px}   .c4-nm{top:3465px;left:117px;width:217px}  .c4-pr{top:3445px;left:373px;width:95px}  .c4-bt{top:3590px;left:114px}
.c5-bg{top:3026px;left:542px}  .c5-img{left:71px;top:41px;width:234px;height:300px} .c5-nm{top:3468px;left:542px;width:187px} .c5-pr{top:3445px;left:813px;width:95px} .c5-bt{top:3590px;left:535px}
.c6-bg{top:3026px;left:985px}  .c6-nm{top:3468px;left:985px;width:166px}  .c6-pr{top:3445px;left:1245px;width:95px} .c6-bt{top:3590px;left:983px}
.nm-ink{color:var(--ink);text-align:left}

.ld-elev-l{position:absolute;top:3817px;left:1px;width:719px;height:629px;background:var(--teal)}
.ld-elev-img{top:3817px;left:722px;width:718px;height:629px;object-fit:cover}
.ld-elev-h{top:3924px;left:89px;width:511px}
.ld-elev-b{top:4097px;left:92px;width:536px}
.ld-elev-btn{top:4278px;left:94px;width:310px;height:73px}

/* ============================================================
   PRODUCTS
   ============================================================ */
.pg-products{--ftr-top:2333px}
.pr-banner{top:160px;height:521px}
.pr-banner img{width:100%;height:100%;object-fit:cover}
.pr-h{top:305px;left:118px;width:859px;color:#fff}
.pr-sub{top:515px;left:119px;width:576px;color:#fff}
.p1-bg{top:815px;left:91px}   .p1-img{left:63px;top:18px}                .p1-nm{top:1257px;left:91px;width:166px}   .p1-pr{top:1237px;left:365px;width:95px}  .p1-bt{top:1357px;left:106px}
.p2-bg{top:815px;left:521px}  .p2-img{left:61px;top:21px;width:269px}    .p2-nm{top:1259px;left:533px;width:219px}  .p2-pr{top:1237px;left:805px;width:95px}  .p2-bt{top:1357px;left:527px}
.p3-bg{top:815px;left:961px}  .p3-img{left:71px;top:21px}                .p3-nm{top:1260px;left:973px;width:206px}  .p3-pr{top:1237px;left:1237px;width:95px} .p3-bt{top:1357px;left:975px}
.p4-bg{top:1536px;left:88px}  .p4-nm{top:1975px;left:109px;width:217px}  .p4-pr{top:1955px;left:365px;width:95px}   .p4-bt{top:2100px;left:106px}
.p5-bg{top:1536px;left:534px} .p5-img{left:71px;top:41px;width:234px;height:300px} .p5-nm{top:1978px;left:534px;width:187px} .p5-pr{top:1955px;left:805px;width:95px} .p5-bt{top:2100px;left:527px}
.p6-bg{top:1536px;left:977px} .p6-nm{top:1978px;left:977px;width:166px}  .p6-pr{top:1955px;left:1237px;width:95px} .p6-bt{top:2100px;left:975px}

/* ============================================================
   CART (empty)
   ============================================================ */
.pg-cart{--ftr-top:761px}
.ce-h{top:236px;left:118px;width:332px}
.ce-sub{top:349px;left:119px;width:438px}
.ce-btn{top:421px;left:119px;width:310px;height:73px}

/* ============================================================
   CONTACT
   ============================================================ */
.pg-contact{--ftr-top:1716px}
.ct-hero{top:163px;height:521px}
.ct-hero img{width:100%;height:100%;object-fit:cover}
.ct-h{top:336px;left:118px;width:859px;color:#fff}
.ct-sub{top:445px;left:125px;width:478px;color:#fff}
.ct-form-h{top:782px;left:293px;width:462px;text-align:center;line-height:90px}
.ct-form-sub{top:876px;left:330px;width:483px}
.ct-name{top:1002px;left:318px;width:385px;height:83px}
.ct-email{top:1002px;left:730px;width:385px;height:83px}
.ct-tel{top:1112px;left:318px;width:797px;height:83px}
.ct-msg{top:1222px;left:312px;width:803px;height:210px}
.ct-send{top:1483px;left:798px;width:310px;height:73px}
.ct-success{top:1002px;left:318px;width:797px;color:var(--blue);font-size:22px;line-height:32px}
.ct-error{top:940px;left:318px;width:797px;color:#ff5a5a}

/* ============================================================
   PRODUCT DETAIL
   ============================================================ */
.pg-detail{--ftr-top:2013px}
.pd-imgbg{position:absolute;top:240px;left:217px;width:375px;height:510px;background:rgba(0,101,245,.05);border-radius:5px}
.pd-img{position:absolute;top:78px;left:61px;width:268px;height:345px;object-fit:contain}
.pd-title{top:242px;left:690px;width:447px;line-height:43px}
.pd-price{position:absolute;top:328px;left:697px;width:95px;font-family:'Mona Sans',sans-serif;font-weight:500;font-size:25px;letter-spacing:.25px;color:var(--blue);line-height:90px;white-space:nowrap}
.pd-desc{top:405px;left:696px;width:483px}
.pd-tag1{top:542px;left:692px;width:217px}
.pd-tag2{top:542px;left:923px;width:280px}
.pd-tag3{top:591px;left:693px;width:99px}
.pd-tag4{top:591px;left:804px;width:171px}
.pd-selqty{top:660px;left:700px;width:106px}
.pd-minus{top:701px;left:700px}
.pd-num{top:701px;left:756px;width:72px}
.pd-plus{top:701px;left:829px}
.pd-cart{top:682px;left:940px;width:310px;height:73px}
.pd-line16{top:875px;height:1px;background:var(--line)}
.pd-rec-h{top:959px;left:281px;width:852px;text-align:center;font-size:55px;line-height:90px;letter-spacing:.55px}
.pd-rec-s{top:1068px;left:418px;width:587px;text-align:center}
.r1-bg{top:1216px;left:88px}   .r1-nm{top:1655px;left:109px;width:217px} .r1-pr{top:1635px;left:365px;width:95px}  .r1-bt{top:1780px;left:106px}
.r2-bg{top:1216px;left:534px}  .r2-img{left:71px;top:41px;width:234px;height:300px} .r2-nm{top:1658px;left:534px;width:187px} .r2-pr{top:1635px;left:805px;width:95px} .r2-bt{top:1780px;left:527px}
.r3-bg{top:1216px;left:977px}  .r3-nm{top:1658px;left:977px;width:166px} .r3-pr{top:1635px;left:1237px;width:95px} .r3-bt{top:1780px;left:975px}

/* ============================================================
   CHECKOUT
   ============================================================ */
.pg-checkout{--ftr-top:2543px}
.ck-line16{top:875px;height:1px;background:var(--line)}
.ck-ship-h{top:936px;left:51px;width:462px;text-align:center;line-height:90px}
.ck-ship-s{top:1030px;left:75px;width:483px}
.ck-f1{top:1156px;left:65px;width:634px;height:83px}
.ck-f2{top:1156px;left:743px;width:634px;height:83px}
.ck-f3{top:1266px;left:65px;width:634px;height:83px}
.ck-f4{top:1266px;left:743px;width:634px;height:83px}
.ck-f5{top:1376px;left:61px;width:1318px;height:83px}
.ck-f6{top:1488px;left:61px;width:423px;height:83px}
.ck-f7{top:1488px;left:511px;width:418px;height:83px}
.ck-f8{top:1488px;left:956px;width:423px;height:83px}
.ck-cb1{top:1606px;left:65px;width:19px}
.ck-cb1-l{top:1606px;left:96px;width:858px}
.ck-f9{top:1658px;left:61px;width:1318px;height:83px}
.ck-f10{top:1770px;left:61px;width:423px;height:83px}
.ck-f11{top:1770px;left:511px;width:418px;height:83px}
.ck-f12{top:1770px;left:956px;width:423px;height:83px}
.ck-pay-h{top:1921px;left:38px;width:253px;text-align:center;line-height:90px}
.ck-f13{top:2036px;left:74px;width:592px;height:83px}
.ck-plus-h{position:absolute;top:2077px;left:638px;width:16px;height:1.5px;background:var(--body)}
.ck-plus-v{position:absolute;top:2070px;left:645px;width:1.5px;height:17px;background:var(--body)}
.ck-f14{top:2154px;left:74px;width:592px;height:83px}
.ck-f15{top:2268px;left:74px;width:190px;height:83px}
.ck-f16{top:2268px;left:276px;width:188px;height:83px}
.ck-f17{top:2268px;left:476px;width:190px;height:83px}
.ck-f17::placeholder{color:#ff5a5a}
.ck-whatis{top:2373px;left:481px;width:106px}
.ck-cb2{top:2044px;left:732px;width:20px}
.ck-agree{top:2044px;left:766px;width:396px}
.ck-agree a{text-decoration:underline;text-underline-position:from-font}
.ck-terms{top:2121px;left:731px;width:643px}
.ck-secure{top:2290px;left:735px;width:265px;height:36px;object-fit:contain}
.ck-line19{position:absolute;top:2452px;left:63px;width:1318px;height:1px;background:var(--line)}

/* ============================================================
   TABLET (768–1439px): proportional zoom (JS-set)
   ============================================================ */
@media (min-width:768px) and (max-width:1439.98px){
  .band,.hdr-line{width:1440px}
}

/* ============================================================
   MOBILE (≤767px) — restrained type scale, even vertical rhythm
   ============================================================ */
@media (max-width:767px){
  body{min-width:0}
  .canvas{width:100%;height:auto !important;display:flex;flex-direction:column}
  .band{display:none}
  .el{position:static;width:auto;height:auto}
  /* elements positioned by their own class keep desktop top/left — clear them first */
  .pcard,.pc-bg,.pc-name,.pc-price,.pc-btn,.pd-imgbg,.tag,.selqty,.qty-btn,.qty-num,
  .field,.cbx,.ld-elev-l,.ld-bs-price,.pd-price,.ck-plus-h,.ck-plus-v,.ck-line19,
  .ftr,.ftr-top,.ftr-brand,.ftr-links,.ftr-addr,.ftr-contact,.ftr-statement,.ftr-line,.ftr-cards,.ftr-copy,.ftr-bottom{top:auto;left:auto;right:auto}

  /* header */
  .site-hdr{order:-1;position:relative;display:flex;align-items:center;padding:14px 20px;background:#fff;border-bottom:1px solid #ececec}
  .hdr-logo{position:static;width:64px;height:45px;margin-right:auto}
  .hdr-cart{position:static;width:38px;height:29px}
  .hamburger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:26px;height:24px;margin-left:18px}
  .hamburger span{display:block;width:100%;height:2.5px;border-radius:2px;background:var(--ink);transition:transform .25s ease,opacity .2s ease}
  .menu-open .hamburger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .menu-open .hamburger span:nth-child(2){opacity:0}
  .menu-open .hamburger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
  .hdr-nav{display:none}
  .menu-open .hdr-nav{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid #ececec;box-shadow:0 14px 24px rgba(32,35,39,.12);padding:4px 20px 12px;z-index:60}
  .hdr-nav .nav-link{position:static;padding:15px 0;border-bottom:1px solid #f2f2f2;font-size:14px}
  .hdr-nav .nav-link:last-child{border-bottom:none}

  /* type — kept deliberately modest */
  .h-80{font-size:30px;line-height:36px}
  .h-60{font-size:25px;line-height:31px}
  .h-40,.h-40-43,.h-40-90{font-size:22px;line-height:28px}
  .pd-rec-h{font-size:24px;line-height:30px}
  .pc-name{font-size:17px}
  .price-35{font-size:20px;line-height:1.2}
  .price-25,.pd-price{font-size:17px;line-height:1.2}
  .body-18{font-size:15px;line-height:23px;width:auto !important}
  .body-16{font-size:14px;line-height:22px;width:auto !important}
  .nav-b,.link-sb{font-size:14px}
  .btn-blue .lbl,.btn-out .lbl{font-size:15px}
  .tag{font-size:12px}
  .selqty{font-size:13px}
  .qty-num{font-size:22px}
  .field{font-size:15px}
  .btn-blue,.btn-out{position:static;width:100%;max-width:320px;height:56px !important;margin:0 auto}

  /* landing — hero */
  .ld-hero{display:flex;flex-direction:column;padding:44px 24px}
  .ld-hero-h{order:1}
  .ld-hero-sub{order:2;padding-top:14px}
  .ld-hero-btn{order:3;margin-top:26px}
  .ld-hero-img{order:4;position:static;width:100%;height:auto;aspect-ratio:652/675;margin-top:32px}

  /* landing — best seller */
  .ld-bs{display:flex;flex-direction:column;padding:44px 24px}
  .ld-bs-img{position:static;width:100%;height:auto;aspect-ratio:642/624}
  .ld-bs-title{padding-top:28px}
  .ld-bs-price{position:static;padding-top:8px}
  .ld-bs-desc{padding-top:12px}
  .ld-bs-btn{margin-top:26px}

  /* landing — grid */
  .ld-grid{display:flex;flex-direction:column;padding:44px 0}
  .ld-sec-h,.ld-sec-sub{width:auto !important;padding:0 24px}
  .ld-sec-sub{padding-top:12px}
  .pgrid{display:flex;flex-direction:column;gap:40px;padding:36px 24px 0}
  .pcard{position:relative;display:flex;flex-direction:column;align-items:center}
  .pc-bg{position:relative;width:100%;max-width:340px;height:auto;aspect-ratio:375/376}
  .pcard .pc-bg .pc-img{position:absolute;top:5%;left:14%;width:72%;height:90%;object-fit:contain}
  .pc-name{position:static;width:auto !important;padding-top:20px;text-align:center}
  .nm-ink{text-align:center}
  .pc-price{position:static;padding-top:4px}
  .pc-btn{position:static;width:100%;max-width:320px;height:56px;margin-top:18px}

  /* landing — elevate (.ld-elev-l is an empty panel; text is its sibling) */
  .ld-elev{display:flex;flex-direction:column;background:var(--teal)}
  .ld-elev-l{display:none}
  .ld-elev-img{order:1;position:static;width:100%;height:auto;aspect-ratio:718/629}
  .ld-elev-h{order:2;padding:44px 24px 0}
  .ld-elev-b{order:3;padding:14px 24px 0}
  .ld-elev-btn{order:4;margin:26px auto 44px}

  /* products + contact banners */
  .pr-intro,.ct-intro{position:relative;display:flex;flex-direction:column;justify-content:center;padding:56px 24px;min-height:260px;isolation:isolate}
  .pr-banner,.ct-hero{display:block !important;position:absolute;inset:0;left:auto;transform:none;width:100%;height:100%;z-index:-1}
  .pr-banner img,.ct-hero img{width:100%;height:100%}
  .pr-h,.ct-h,.pr-sub,.ct-sub{width:auto !important}
  .pr-sub,.ct-sub{padding-top:12px}
  .pg-products .pgrid{padding:44px 24px}

  /* cart */
  .ce{display:flex;flex-direction:column;padding:48px 24px}
  .ce-sub{padding-top:14px}
  .ce-btn{margin-top:26px}

  /* contact form */
  .ct-form{display:flex;flex-direction:column;padding:44px 24px}
  .ct-form-h{line-height:1.2 !important;text-align:left}
  .ct-form-sub{padding-top:12px}
  .field{position:static;width:100% !important;height:56px !important;margin-top:14px;padding:0 18px}
  textarea.field{height:170px !important;padding:16px 18px}
  .ct-send{margin-top:26px}
  .ct-success,.ct-error{position:static;width:auto !important;padding-top:16px}

  /* product detail + checkout */
  .pd-hero,.ck-hero{position:relative;display:flex;flex-direction:column;padding:44px 24px}
  .pd-imgbg{position:relative;width:100%;max-width:340px;height:auto;aspect-ratio:375/510;align-self:center}
  .pd-imgbg .pd-img{position:absolute;top:15.3%;left:16.3%;width:71.5%;height:67.6%;object-fit:contain}
  .pd-title{padding-top:26px}
  .pd-price{position:static;padding-top:4px}
  .pd-desc{padding-top:12px}
  .pd-tags{display:flex;flex-wrap:wrap;gap:9px;padding-top:18px}
  .tag{position:static;width:auto !important;height:auto;padding:8px 14px;white-space:normal}
  .selqty{position:static;padding-top:22px}
  [data-qty-wrap]{display:flex;align-items:center;gap:18px;padding-top:12px}
  .qty-btn{position:relative;flex:0 0 49px}
  .qty-num{position:static;width:40px;text-align:center}
  .pd-cart{margin-top:24px}
  .pd-rec{display:flex;flex-direction:column;padding:8px 0 44px}
  .pd-rec-h,.pd-rec-s{width:auto !important;padding:0 24px;line-height:1.25 !important}
  .pd-rec-s{padding-top:12px}

  /* checkout */
  .ck-ship,.ck-pay{display:flex;flex-direction:column;padding:0 24px 44px}
  .ck-ship-h,.ck-pay-h{width:auto !important;line-height:1.2 !important;text-align:left;padding-bottom:4px}
  .ck-ship-s{padding-bottom:6px}
  .ck-check-row,.ck-agree-row{display:flex;align-items:flex-start;gap:12px;padding:18px 0 4px}
  .cbx{position:static;flex:0 0 20px;margin-top:2px}
  .ck-cb1-l,.ck-agree,.ck-whatis,.ck-terms{width:auto !important}
  .ck-whatis{padding-top:10px}
  .ck-terms{padding-top:16px}
  .ck-plus-h,.ck-plus-v,.ck-line19{display:none}
  .ck-secure{position:static;margin:22px auto 0}

  /* footer */
  .canvas{min-width:0}
  .ftr{position:static;width:auto;max-width:100%;min-width:0;padding:36px 24px 28px;border-top:1px solid var(--line)}
  .ftr-top,.ftr-brand,.ftr-bottom{max-width:100%;min-width:0}
  .ftr-top{flex-direction:column;gap:28px}
  .ftr-brand{max-width:none}
  .ftr-seller{font-size:18px}
  .ftr-addr,.ftr-contact,.ftr-statement,.ftr-copy{font-size:14px}
  .ftr-contact{flex-direction:column;align-items:flex-start;gap:6px;width:100%}
  .ftr-dot{display:none}
  .ftr-links{grid-template-columns:1fr 1fr;justify-content:start;column-gap:20px;row-gap:12px;width:100%}
  .ftr-links a{white-space:normal;font-size:14px}
  .ftr-line{margin:24px 0 16px}
  .ftr-bottom{align-items:flex-start;flex-direction:column}
  .ftr-cards{width:132px;height:28px}

  .pgrid-flow{display:flex;flex-direction:column;padding:44px 24px !important;gap:40px}
  .pcard-flow{width:100%}
  .pd-hero-flow{flex-direction:column;padding:44px 24px !important;gap:0}
  .pd-hero-flow .pd-imgbg{flex:none}
  .ck-grid,.ck-pay-grid,.ck-exp-row{grid-template-columns:1fr !important}
  .pg-checkout.pg-flow #frmOrder{padding:24px 0 !important}
  .legal-page{padding:44px 24px !important}
  .pg-flow .ftr{height:auto}
  .ck-cart{padding:24px !important}
  .ck-line{flex-wrap:wrap}
  .ck-cart-actions{flex-direction:column}
  .ck-submit{width:100%;max-width:320px}
  .hdr-cart{position:relative}
}

/* ============================================================
   FLOW PAGES (catalog, detail, checkout, legal)
   ============================================================ */
.hdr-cart{position:absolute}
.hdr-cart-qty{
  position:absolute;top:-8px;right:-10px;min-width:18px;height:18px;padding:0 4px;
  background:var(--blue);color:#fff;border-radius:99px;font-family:'Inter',sans-serif;
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1
}
.hdr-cart-qty:empty,.hdr-cart-qty.is-zero{display:none}

.pg-flow .canvas{height:auto !important;min-height:100vh}
.pg-flow .ftr{position:relative;top:auto;margin-top:80px;height:auto}

.pgrid-flow{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,375px);
  justify-content:center;
  gap:72px 40px;
  padding:840px 0 40px
}
.pg-detail .pgrid-flow,.pg-legal .pgrid-flow{padding:48px 0 40px}
.pcard-flow{position:relative;display:flex;flex-direction:column;align-items:center;width:375px}
.pcard-flow .pc-bg{position:relative}
.pcard-flow .pc-img{left:54px}
.pcard-flow .pc-name{position:static;width:100%;text-align:center;padding:18px 8px 0;min-height:70px;font-size:22px;line-height:1.25}
.pcard-flow .nm-ink{text-align:center}
.pcard-flow .pc-price{position:static;line-height:1.2;padding:4px 0 10px}
.pcard-flow .pc-btn{position:static}

.pd-hero-flow{
  position:relative;
  display:flex;
  gap:72px;
  padding:220px 140px 48px;
  align-items:flex-start
}
.pd-hero-flow .pd-imgbg{position:relative;top:auto;left:auto;flex:0 0 375px}
.pd-hero-flow .pd-copy{flex:1;min-width:0}
.pd-hero-flow .pd-title,.pd-hero-flow .pd-price,.pd-hero-flow .pd-desc,.pd-hero-flow .selqty{position:static;top:auto;left:auto;width:auto}
.pd-hero-flow .pd-title{margin-bottom:8px}
.pd-hero-flow .pd-price{color:var(--blue);margin-bottom:8px}
.pd-hero-flow .pd-desc{max-width:560px}
.pd-hero-flow .pd-tags{position:static;display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}
.pd-hero-flow .tag{position:static;width:auto !important;height:auto;white-space:normal}
.pd-hero-flow .qty-row{display:flex;align-items:center;gap:14px;margin:12px 0 22px}
.pd-hero-flow .qty-btn,.pd-hero-flow .qty-num{position:relative;top:auto;left:auto}
.pd-hero-flow .pd-cart{position:static;width:310px;height:73px}
.pd-rec-flow{position:relative;padding:24px 0 40px}
.pd-rec-flow .pd-rec-h,.pd-rec-flow .pd-rec-s{position:static;width:auto;text-align:center;margin:0 auto}
.pd-rec-flow .pd-rec-h{font-size:55px;line-height:1.2;letter-spacing:.55px;max-width:900px;padding:0 40px}
.pd-rec-flow .pd-rec-s{padding:12px 40px 8px}

.pg-checkout.pg-flow #frmOrder{position:relative;padding:200px 61px 40px}
.ck-cart{position:relative;margin-bottom:36px}
.ck-cart-h{position:static;margin-bottom:18px}
.ck-line{display:flex;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}
.ck-line-img{width:96px;height:96px;object-fit:contain;background:var(--cardbg);border-radius:4px}
.ck-line-copy{flex:1;min-width:0}
.ck-line-name{font-family:'Manrope',sans-serif;font-weight:600;font-size:22px;color:var(--blue)}
.ck-line-meta{font-size:16px;margin-top:6px;color:var(--muted)}
.ck-line-rm{margin-left:auto;color:var(--blue);font-weight:600;font-size:16px;background:none;border:none;cursor:pointer}
.ck-totals{margin-top:18px;font-size:18px;display:flex;flex-direction:column;gap:8px}
.ck-grand{font-weight:700}
.ck-cart-actions{display:flex;gap:16px;margin-top:22px;flex-wrap:wrap}
.ck-cart-actions .btn-out{position:static;width:auto;height:56px;padding:0 22px}
.ck-upsells{display:flex;flex-wrap:wrap;gap:16px;margin-top:28px}
.offerBox{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:6px;padding:14px 16px;flex:1;min-width:280px}
.offerBox label{font-size:15px;line-height:1.4}
.offerBox input[type="checkbox"]{width:20px;height:20px;flex:0 0 20px;accent-color:var(--blue);cursor:pointer}
.ck-flow{position:relative;padding:28px 0}
.ck-flow .ck-ship-h,.ck-flow .ck-pay-h,.ck-flow .ck-ship-s{position:static;width:auto;text-align:left;line-height:1.25}
.ck-flow .ck-ship-s{margin:8px 0 22px;max-width:640px}
.ck-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 28px}
.ck-span2{grid-column:1/-1}
.ck-flow .field,.ck-pay-fields .field{position:static;width:100%;height:83px}
select.field{appearance:none;-webkit-appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23202327' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 22px center}
.ck-check-row,.ck-agree-row{display:flex;align-items:flex-start;gap:12px;margin:22px 0 8px}
.ck-check-row .cbx,.ck-agree-row .cbx{position:static;flex:0 0 20px;margin-top:2px}
.ck-pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.ck-pay-fields,.ck-pay-aside{display:flex;flex-direction:column;gap:18px}
.ck-exp-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.ck-whatis,.ck-agree,.ck-terms,.ck-secure{position:static;width:auto}
.ck-agree a,.ck-whatis a{text-decoration:underline}
.ck-submit{position:static;width:310px;height:73px;margin-top:8px;border:none;cursor:pointer}
.ck-submit:disabled{opacity:.45;cursor:not-allowed}
.pd-hero-flow .pd-statement{position:static;margin:0 0 12px;max-width:560px}
.pd-hero-flow .pd-fda{position:static;margin:16px 0 0;max-width:560px;font-size:14px;line-height:1.5}
.facts{width:100%;border-collapse:collapse;margin:12px 0 8px}
.facts th,.facts td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.facts th{width:34%}
.pd-specs{position:static;margin:12px 0 0;padding-left:18px;max-width:560px}
.pd-specs li{margin:0 0 6px;font-size:15px;line-height:1.45}
.is-soon{opacity:.55;pointer-events:none;cursor:default}
.ing-block{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:start;margin:18px 0 36px}
.ing-block img{width:220px;height:auto;background:var(--cardbg);border-radius:4px}
.formError{border-color:#ff5a5a !important}

.legal-page{position:relative;padding:220px 140px 40px}
.legal-h{position:static;margin-bottom:28px}
.legal-body h3{font-family:'Mona Sans',sans-serif;font-size:22px;margin:28px 0 10px;color:var(--ink)}
.legal-body p,.legal-body li{margin-bottom:12px;line-height:1.55}
.legal-body a{color:var(--blue);text-decoration:underline}
.legal-mod{margin-top:32px;color:var(--muted)}
.cvv-img{max-width:100%;height:auto;margin-top:24px}

.thank-block{position:relative;padding:220px 118px 80px;min-height:420px}
.thank-block .ce-h,.thank-block .ce-sub,.thank-block .ce-btn{position:static}
.thank-block .ce-sub{max-width:560px;padding:10px 0}
.thank-block .ce-btn{margin-top:24px}

#pop_overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:99999;display:flex;align-items:center;justify-content:center}
#pop_content{background:#fff;padding:28px;border-radius:8px;position:relative;max-width:520px}
#pop_content .cross{position:absolute;top:8px;right:12px;font-size:28px;line-height:1;background:none;border:none;cursor:pointer}
.popup-loading-wrapper{position:fixed;inset:0;background:rgba(32,35,39,.55);z-index:100000;display:flex;align-items:center;justify-content:center}
.popup-loading-wrapper .popup{background:#fff;padding:40px 36px;border-radius:8px;text-align:center}
.popup-loading-wrapper h3{font-family:'Mona Sans',sans-serif;margin-top:8px}

@media (min-width:768px) and (max-width:1439.98px){
  .pg-flow .pgrid-flow{grid-template-columns:repeat(3,375px)}
}

@media (max-width:767px){
  .hdr-cart{position:relative !important;top:auto;left:auto}
  .pg-flow .pgrid-flow{padding:44px 24px !important;grid-template-columns:1fr}
  .pcard-flow{width:100%;max-width:340px;margin:0 auto}
  .pd-hero-flow{padding:44px 24px !important}
  .legal-page,.thank-block{padding:44px 24px !important}
  .ing-block{grid-template-columns:1fr}
  .ing-block img{width:180px}
  .pg-checkout.pg-flow #frmOrder{padding:0 0 24px !important}
  .ck-cart{padding:0 24px !important}
  .ck-flow{padding:0 24px 32px}
}
