/* ============================================================
   Peak Vision Optical — Figma canvas "peakvisionoptical (eye)" (635:42),
   1440px canvas. Desktop = exact Figma coordinates.
   768–1439px = proportional zoom.  ≤767px = mobile reflow + hamburger.
   Frames: Landing 635:78 [3057] · Products 643:873 [2491]
           Empty-cart 644:1063 [1191] · Product-details 644:1084 [2633]
           Checkout 644:1125 [3064]
   ============================================================ */

/* ---------- 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; the whole weight range is one file per subset) */
@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}

/* ---------- Design tokens (read from the Figma nodes) ---------- */
:root{
  --mint:#a1d6bd;                 /* primary buttons, cart chips */
  --peach:#fbccbd;                /* the "A Must Have" button only */
  --price-chip:#aad0ea;           /* the price pill on each card */
  --ink:#464646;                  /* nav, card names, product title, button labels */
  --body:#17110f;                 /* descriptions + footer block */
  --dark:#202327;                 /* "Shipping Information" / "Payment" */
  --price:#353535;                /* prices */
  --panel:rgba(139,207,204,.08);  /* product-card panels (#8BCFCC @ 8%) */
  --panel-pd:#f6fbfb;             /* detail + checkout product panel */
  --chip-hdr:#eceae6;             /* header cart chip */
  --ftr-bg:#f9f8f3;               /* the footer panel */
  --rule:#eceae6;                 /* header + section hairlines */
  --rule-ftr:rgba(0,0,0,.13);     /* the footer hairline is a DIFFERENT colour */
  --field-line:#464646;
}

/* ---------- Base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{height:100%}
html,body{background:#fff}
body{font-family:'Inter Display','Inter',sans-serif;min-height:100%;margin:0}
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:2975px}   /* ftr-top 2417 + footer 538 + 20 */
.pg-products .canvas{height:2335px}   /* ftr-top 1777 + 538 + 20 */
.pg-products-all .canvas{
  height:auto!important;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  padding-bottom:0;
}
.pg-products-all .ftr{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  margin:48px auto 24px;
  flex-shrink:0;
}
.pg-products-all .pr-intro-flow{
  position:relative;
  padding:200px 80px 0;
  text-align:center;
}
.pg-products-all .pr-h,
.pg-products-all .pr-sub{
  position:static!important;
  width:auto!important;
  max-width:780px;
  margin-left:auto;
  margin-right:auto;
}
.pg-products-all .pr-sub{margin-top:16px;color:var(--ink)}
.pg-products-all .pr-line19{position:static!important;transform:none;width:100%;height:1px;margin:36px 0 0}

.pgrid-all{
  display:grid;
  grid-template-columns:repeat(3, 375px);
  justify-content:center;
  gap:48px 36px;
  padding:48px 40px 20px;
  width:100%;
  box-sizing:border-box;
}
.pcard-flow{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:375px;
  color:inherit;
}
.pcard-flow .pc-bg{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  width:375px;
  height:376px;
}
.pcard-flow .pc-chip{
  position:static!important;
  margin-top:16px;
}
.pcard-flow .pc-name{
  position:static!important;
  width:100%;
  margin-top:14px;
  text-align:center;
  font-size:22px;
  line-height:1.25;
  min-height:56px;
}
.pcard-flow .pc-alt{
  display:block;
  font-size:14px;
  font-weight:500;
  color:#777;
  margin-top:4px;
}
.pcard-flow .pc-cart{
  position:static!important;
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pcard-flow .pc-cart img{
  position:static;
  width:18px;
  height:23px;
}
.pcard-flow .pc-img{
  position:absolute!important;
}

@media (min-width:768px) and (max-width:1199.98px){
  .pg-products-all .canvas{width:100%!important}
  .pgrid-all{grid-template-columns:repeat(2, minmax(260px, 340px));gap:36px 28px;padding:40px 24px 20px}
  .pcard-flow,.pcard-flow .pc-bg{width:100%;max-width:340px}
  .pcard-flow .pc-bg{height:auto;aspect-ratio:375/376}
}
.pg-cart     .canvas{height:1154px}   /* ftr-top 596 + 538 + 20 */
.pg-detail   .canvas{height:2601px}   /* ftr-top 2043 + 538 + 20 */
.pg-checkout .canvas{height:3020px}   /* ftr-top 2462 + 538 + 20 */
.pg-contact  .canvas{height:2338px}   /* ftr-top 1780 + 538 + 20 */

/* Flow pages (cart with items, legal) — sticky footer, no dead space below */
.pg-cart-flow .canvas,
.pg-legal .canvas{
  height:auto!important;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  padding-bottom:0;
}
.pg-cart-flow .ftr,
.pg-legal .ftr{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  margin:48px auto 24px;
  flex-shrink:0;
}
.pg-cart-flow .site-hdr,
.pg-legal .site-hdr{flex-shrink:0}
.pg-cart-flow .cart-flow,
.pg-legal .legal-wrap{flex:1 0 auto;width:100%}

/* Nav cart qty */
.nav-cart .cartqty{
  display:inline-block;min-width:18px;margin-left:4px;
  font-size:14px;font-weight:700;color:var(--ink)
}

.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}
.h-70{font-size:70px;line-height:80px;letter-spacing:.7px;color:#000}
.h-80{font-size:80px;line-height:90px;letter-spacing:.8px;color:var(--body)}
.h-55{font-size:55px;line-height:70px;letter-spacing:.55px;color:#000}
.h-48{font-size:48px;line-height:80px;letter-spacing:.48px;color:#000}
.h-40{font-size:40px;line-height:43px;letter-spacing:.4px;color:var(--ink)}
.h-40-90{font-size:40px;line-height:90px;letter-spacing:.4px;color:var(--dark)}
.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-19{font-family:'Inter Display','Inter',sans-serif;font-weight:400;font-size:19px;letter-spacing:.19px;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}
.label-17{font-family:'Inter Display','Inter',sans-serif;font-weight:400;font-size:17px;letter-spacing:.17px;color:var(--body);line-height:normal}
.nav-b{font-family:'Inter',sans-serif;font-weight:700;font-size:18px;letter-spacing:.18px;color:var(--ink);line-height:normal;white-space:nowrap}
.link-sb{font-family:'Inter',sans-serif;font-weight:600;font-size:18px;letter-spacing:.18px;color:var(--ink);line-height:normal;white-space:nowrap}
/* prices are leading-90 inside a shorter fixed box in Figma */
.price{font-family:'Mona Sans',sans-serif;font-weight:600;font-size:20px;letter-spacing:.2px;color:var(--price);line-height:90px;white-space:nowrap}
.price-lg{font-family:'Mona Sans',sans-serif;font-weight:600;font-size:25px;letter-spacing:.25px;color:var(--price);line-height:90px;white-space:nowrap}
.qty-num{font-family:'Inter',sans-serif;font-weight:400;font-size:45px;letter-spacing:.45px;color:var(--ink);line-height:normal;text-align:center}

/* ---------- Buttons ---------- */
.btn-mint{background:var(--mint);display:flex;align-items:center;justify-content:center}
.btn-peach{background:var(--peach);display:flex;align-items:center;justify-content:center}
.btn-mint .lbl,.btn-peach .lbl{font-family:'Manrope',sans-serif;font-weight:700;font-size:22px;text-align:center;white-space:nowrap}
.btn-mint .lbl{color:var(--ink)}
.btn-peach .lbl{color:#000}

/* ---------- Form fields ---------- */
.field{position:absolute;background:#fff;border:1px solid var(--field-line);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:#7cc2a4}
.cbx{position:absolute;width:20px;height:20px;appearance:none;-webkit-appearance:none;background:#fff;
     border:1px solid var(--field-line);border-radius:5px;cursor:pointer}
.cbx:checked::after{content:'';position:absolute;left:6px;top:2px;width:5px;height:10px;
     border:solid var(--ink);border-width:0 2px 2px 0;transform:rotate(45deg)}

/* hairlines — the footer's is a different colour from the rest */
.hdr-line,.ld-line19,.pr-line19,.pd-line16,.ck-line16{background:var(--rule)}
.ftr-line{background:var(--rule-ftr)}

/* ---------- Header (identical on all five frames) ---------- */
.site-hdr{position:static}
.hdr-logo{top:23px;left:629px;width:205px;height:102px;z-index:42}
.hdr-logo img{width:100%;height:100%;object-fit:contain}
.nav-link{top:71px;z-index:42}
.nav-products{left:152px}
.nav-contact{left:338px}
.nav-cart{left:1188px}
.hdr-cart{top:60px;left:1257px;width:54px;height:41px;background:var(--chip-hdr);border-radius:80px;z-index:42}
.hdr-cart img{position:absolute;top:10px;left:17px;width:27px;height:20.155px}
.hdr-line{top:145px;height:1px}
.hamburger{display:none}

/* ---------- Product card (same component on both grids) ---------- */
.pc-bg{position:absolute;width:375px;height:376px;background:var(--panel);border-radius:31px}
.pc-img{position:absolute;object-fit:contain}
/* the price is nested INSIDE the chip and centred via flex — Figma's own
   layout has the price text jammed against the pill's right edge (37px
   left padding vs 6px right), which reads as broken rather than designed,
   so it's centred here instead of reproduced literally */
.pc-chip{position:absolute;width:204px;height:47px;background:var(--price-chip);border-radius:80px;display:flex;align-items:center;justify-content:center}
.pc-price{position:static;width:auto;text-align:center}
.pc-name{position:absolute;font-family:'Manrope',sans-serif;font-weight:700;font-size:30px;color:var(--ink);line-height:normal}
.pc-cart{position:absolute;width:145px;height:47px;background:var(--mint);border-radius:80px}
.pc-cart img{position:absolute;top:10.46px;left:62px;width:18px;height:23.105px}
/* panel-relative art — the three products repeat across every grid */
.pc-img-a{top:70px;left:42px;width:298px;height:242px}
.pc-img-b{top:85px;left:74px;width:271px;height:220px}
.pc-img-c{top:79px;left:44px;width:309px;height:251px}

/* ---------- Qty stepper (bare controls, no pill in this design) ---------- */
.qty-btn{position:absolute;background:none;border:none;display:flex;align-items:center;justify-content:center}
.qty-btn img{width:100%;height:100%;object-fit:contain}
.qty-btn::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px}

/* ---------- Footer — one 1226x538 panel, contents panel-relative ---------- */
.ftr{position:absolute;top:var(--ftr-top);left:115px;width:1226px;height:538px;
     background:var(--ftr-bg);border-radius:51px}
.ftr-addr{position:absolute;top:75px;left:98px;width:473px}
.ftr-fda{position:absolute;top:83px;left:697px;width:451px}
.ftr-email{position:absolute;top:140px;left:94px;width:473px}
.ftr-email .u{text-decoration:underline;text-underline-position:from-font}
.ftr-phone{position:absolute;top:201px;left:98px;width:137px}
.ftr-terms,.ftr-privacy,.ftr-contact-l,.ftr-refund,.ftr-shipping,.ftr-return,.ftr-dispute{position:static}
.ftr-links{
  position:absolute;top:280px;left:99px;width:1028px;
  display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center
}
.ftr-links a{white-space:nowrap}
.ftr-line{position:absolute;top:369px;left:1px;width:1223px;height:1px}
.ftr-copy{position:absolute;top:450px;left:113px;width:522px}

/* ============================================================
   LANDING
   ============================================================ */
.pg-landing{--ftr-top:2417px}
/* Figma reports this node's x as its right edge (the fill is flipped);
   1363 - 615 = 748 is the true left. */
.ld-hero-img{top:207px;left:748px;width:615px;height:515px;object-fit:cover;border-radius:30px}
.ld-hero-h{top:216px;left:136px;width:570px}
.ld-hero-body{top:492px;left:139px;width:522px;color:var(--ink)}
.ld-hero-btn{top:588px;left:139px;width:310px;height:73px;border-radius:50px}
.ld-line19{top:775px;height:1px}
.ld-top-h{top:866px;left:456px;width:502px;text-align:center}
/* row of three — the group sits at 81,1029 */
.c1-bg{top:1040px;left:81px}   .c1-chip{top:1054px;left:238px}
.c1-nm{top:1436px;left:95px;width:206px}  .c1-cart{top:1432px;left:307px}
.c2-bg{top:1036px;left:519px}  .c2-chip{top:1054px;left:674px}
.c2-nm{top:1436px;left:525px;width:197px} .c2-cart{top:1432px;left:746px}
.c3-bg{top:1032px;left:957px}  .c3-chip{top:1050px;left:1112px}
.c3-nm{top:1432px;left:963px;width:197px} .c3-cart{top:1428px;left:1184px}
/* "A Must Have" band */
.ld-must-img{top:1659px;left:701px;width:640px;height:652px;object-fit:cover;border-radius:51px}
.ld-must-h{top:1806px;left:143px;width:456px}
.ld-what{top:1971px;left:148px;width:284px}
.ld-must-btn{top:2035px;left:128px;width:310px;height:73px;border-radius:36.5px}

/* ============================================================
   PRODUCTS
   ============================================================ */
.pg-products{--ftr-top:1777px}
.pr-h{top:263px;left:350px;width:769px;text-align:center}
.pr-sub{top:385px;left:366px;width:737px;color:var(--ink)}
.pr-line19{top:532px;height:1px}
/* row 1 */
.p1-bg{top:628px;left:100px}   .p1-chip{top:642px;left:257px}
.p1-nm{top:1024px;left:114px;width:206px} .p1-cart{top:1020px;left:326px}
.p2-bg{top:624px;left:538px}   .p2-chip{top:642px;left:693px}
.p2-nm{top:1024px;left:544px;width:197px} .p2-cart{top:1020px;left:765px}
.p3-bg{top:620px;left:976px}   .p3-chip{top:638px;left:1131px}
.p3-nm{top:1020px;left:982px;width:197px} .p3-cart{top:1016px;left:1203px}
/* row 2 — the same component instanced at 100,1167 */
.p4-bg{top:1178px;left:100px}  .p4-chip{top:1192px;left:257px}
.p4-nm{top:1574px;left:114px;width:206px} .p4-cart{top:1570px;left:326px}
.p5-bg{top:1174px;left:538px}  .p5-chip{top:1192px;left:693px}
.p5-nm{top:1574px;left:544px;width:197px} .p5-cart{top:1570px;left:765px}
.p6-bg{top:1170px;left:976px}  .p6-chip{top:1188px;left:1131px}
.p6-nm{top:1570px;left:982px;width:197px} .p6-cart{top:1566px;left:1203px}

/* ============================================================
   CART (empty)
   ============================================================ */
.pg-cart{--ftr-top:596px}
.ce-h{top:262px;left:581px;width:234px;text-align:center}
.ce-sub{top:358px;left:503px;width:438px}
.ce-btn{top:419px;left:554px;width:310px;height:73px;border-radius:50px}

/* ============================================================
   PRODUCT DETAIL
   ============================================================ */
.pg-detail{--ftr-top:2043px}
.pd-panel{position:absolute;top:240px;left:214px;width:375px;height:510px;background:var(--panel-pd);border-radius:31px}
.pd-img{position:absolute;top:102px;left:24px;width:342px;height:278px;object-fit:contain}
.pd-title{top:317px;left:684px;font-family:'Manrope',sans-serif;font-weight:700;font-size:30px;color:var(--ink);line-height:normal}
.pd-desc{top:372px;left:684px;width:441px}
.pd-price{position:absolute;top:453px;left:684px;width:107px}
.pd-qty{position:static}
.pd-minus{top:589.5px;left:747px;width:25px;height:3px}
.pd-num{position:absolute;top:563px;left:784px;width:24px;height:49px}
.pd-plus{top:577.5px;left:848px;width:25px;height:25px}
.pd-cartbox{position:absolute;top:555px;left:929px;width:219px;height:69px;background:var(--mint);border-radius:80px}
.pd-cartbox img{position:absolute;top:14.46px;left:92px;width:33px;height:36.667px}
.pd-vec{top:815.854px;left:737px;width:18px;height:21.287px}
.pd-line16{top:855px;height:1px}
.pd-about-h{top:1040px;left:215px;width:447px}
.pd-about-b{top:1119px;left:214px;width:407px}
.pd-img1{top:907px;left:710px;width:513px;height:519px;object-fit:cover;border-radius:31px}
.pd-img2{top:1500px;left:187px;width:1045px;height:461px;object-fit:cover;border-radius:31px}

/* ============================================================
   CHECKOUT
   ============================================================ */
.pg-checkout{--ftr-top:2462px}
.ck-panel{position:absolute;top:241px;left:224px;width:375px;height:510px;background:var(--panel-pd);border-radius:31px}
.ck-img{position:absolute;top:102px;left:24px;width:342px;height:278px;object-fit:contain}
.ck-title{top:317px;left:694px;width:357px;font-family:'Manrope',sans-serif;font-weight:700;font-size:30px;color:var(--ink);line-height:normal}
.ck-desc{top:373px;left:694px;width:441px}
.ck-price{position:absolute;top:454px;left:694px;width:107px}
.ck-qty{position:static}
.ck-minus{top:590.5px;left:737px;width:25px;height:3px}
.ck-num{position:absolute;top:564px;left:774px;width:24px;height:49px}
.ck-plus{top:578.5px;left:838px;width:25px;height:25px}
.ck-removebox{position:absolute;top:554px;left:919px;width:246px;height:69px;background:var(--mint);border-radius:80px}
.ck-remove-l{position:absolute;top:21px;left:23px;width:204px;height:26px;line-height:26px;text-align:center;
             font-family:'Manrope',sans-serif;font-weight:700;font-size:19px;color:var(--ink);white-space:nowrap}
.ck-line16{top:875px;height:1px}

.ck-ship-h{top:936px;left:51px;width:462px;text-align:center}
.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}
.ck-f13{top:2036px;left:74px;width:592px;height:83px}
/* the "+" beside "Select a card" is two separate 3px strokes in Figma whose
   centrelines genuinely don't intersect — reproduced as drawn */
.ck-plus-h{position:absolute;top:2075.5px;left:638px;width:16px;height:3px;background:#000}
.ck-plus-v{position:absolute;top:2087px;left:630.5px;width:3px;height:17px;background:#000}
.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}
/* Figma gives the CVV placeholder this pink — a leftover from another page of
   the file, but it is what the frame renders */
.ck-f17::placeholder{color:#dd528b}
.ck-whatis{top:2373px;left:481px;width:106px}
.ck-cb2{top:1984px;left:732px;width:20px}
.ck-agree{top:1984px;left:766px;width:396px}
.ck-agree a{text-decoration:underline;text-underline-position:from-font}
.ck-co-btn{top:2050px;left:732px;width:607px;height:73px;border-radius:38px}
.ck-terms{top:2162px;left:731px;width:643px}
.ck-secure{top:2331px;left:735px;width:265px;height:36px;object-fit:contain}

/* ============================================================
   CONTACT (no Figma frame for this page — built from the same
   design system: mint/cream palette, existing type/button/field
   classes, identical header + footer to every other page)
   ============================================================ */
.pg-contact{--ftr-top:1780px}
.ct-hero-h{top:374px;left:136px;width:570px}
.ct-hero-sub{top:484px;left:139px;width:522px;color:var(--ink)}
.ct-hero-img{top:207px;left:748px;width:615px;height:515px;object-fit:cover;border-radius:30px}
.ct-line19{top:775px;height:1px;background:var(--rule)}

.ct-form-h{top:936px;left:489px;width:462px;text-align:center}
.ct-form-sub{top:1046px;left:370px;width:700px;text-align:center;color:var(--body)}
.ct-f1{top:1140px;left:61px;width:645px;height:83px}
.ct-f2{top:1140px;left:734px;width:645px;height:83px}
.ct-f3{top:1250px;left:61px;width:1318px;height:83px}
.ct-f4{top:1360px;left:61px;width:1318px;height:210px;padding-top:24px;resize:none;
       font-family:'Inter Display','Inter',sans-serif;font-size:17px;letter-spacing:.17px;
       line-height:1.5;color:var(--body)}
.ct-send{top:1620px;left:565px;width:310px;height:73px;border-radius:50px}

/* ============================================================
   TABLET 768–1439px
   The exact 1440 desktop layout, proportionally scaled.
   js/main.js sets .canvas zoom = clientWidth / 1440, driven by the same
   matchMedia query as this block so the two can never disagree.
   ============================================================ */
@media (min-width:768px) and (max-width:1439.98px){
  html,body{overflow-x:hidden}
  .canvas{width:1440px;margin:0 auto}
  /* Flow pages skip zoom — use fluid width instead of 1440px canvas */
  .pg-cart-flow .canvas,
  .pg-legal .canvas,
  .pg-products-all .canvas{
    width:100%!important;
    max-width:1200px;
    zoom:1!important;
  }
  .pg-cart-flow .cart-flow{padding:160px 32px 40px}
  .pg-legal .legal-wrap{margin-top:160px;padding:0 32px}
  .pg-products-all .pr-intro-flow{padding:160px 32px 0}
  .pg-cart-flow .ftr,
  .pg-legal .ftr,
  .pg-products-all .ftr{
    width:min(1226px, calc(100% - 48px))!important;
    margin-left:auto;
    margin-right:auto;
  }
}

/* ============================================================
   MOBILE ≤767px — hand-built single-column reflow + hamburger.
   Type is stepped DOWN from Figma rather than reused at full size:
   80/90 -> 30/36 · 70/80 -> 28/34 · 55/70 -> 26/32 · 48/80 -> 24/30
   40 -> 24 · 30 -> 20 · 25 -> 18 · 22 -> 16 · 20/19/18/17 -> 14 · 45 -> 26
   Every image is capped so nothing runs the full width.
   ============================================================ */
@media (max-width:767.98px){
  html,body{overflow-x:hidden}
  body{-webkit-text-size-adjust:100%}

  .canvas{width:100%!important;height:auto!important;zoom:1!important;
          display:flex;flex-direction:column;overflow:hidden}

  /* everything positioned by its own class returns to flow — clearing
     top/left alone leaves them out of flow and the sections collapse */
  .el,.band,.wrap,
  .pc-bg,.pc-img,.pc-chip,.pc-price,.pc-name,.pc-cart,
  .qty-btn,.qty-num,.field,.cbx,
  .ftr,.ftr-addr,.ftr-fda,.ftr-email,.ftr-phone,.ftr-terms,.ftr-privacy,
  .ftr-contact-l,.ftr-refund,.ftr-shipping,.ftr-return,.ftr-dispute,.ftr-line,.ftr-copy,
  .ftr-links,
  .pd-panel,.pd-img,.pd-title,.pd-price,.pd-cartbox,.pd-num,
  .ck-panel,.ck-img,.ck-title,.ck-price,.ck-removebox,.ck-num,
  .ck-plus-h,.ck-plus-v,
  .ct-hero-h,.ct-hero-sub,.ct-hero-img,.ct-form-h,.ct-form-sub,.ct-send,
  .pkg-opts,.pkg-bx,.pd-points,.legal-wrap,.cart-flow,.pr-intro-flow{
    position:static;top:auto;left:auto;right:auto;bottom:auto;
    transform:none;width:auto;height:auto}

  /* ---- stepped-down type ---- */
  .h-80{font-size:30px;line-height:36px;letter-spacing:0}
  .h-70{font-size:28px;line-height:34px;letter-spacing:0}
  .h-55{font-size:26px;line-height:32px;letter-spacing:0}
  .h-48{font-size:24px;line-height:30px;letter-spacing:0}
  .h-40,.h-40-90{font-size:24px;line-height:30px;letter-spacing:0}
  .body-18,.body-19{font-size:14px;line-height:22px}
  .body-16{font-size:14px;line-height:21px}
  .label-17,.nav-b,.link-sb{font-size:14px}
  .price{font-size:14px;line-height:normal}
  .price-lg{font-size:18px;line-height:normal}
  .qty-num{font-size:26px;line-height:34px}
  .btn-mint,.btn-peach{height:52px!important}
  .btn-mint .lbl,.btn-peach .lbl{font-size:16px}

  /* ---------- Header: logo left, cart + burger right ---------- */
  .site-hdr{position:relative;display:flex;flex-direction:column;z-index:50}
  .hdr-logo{position:relative;width:132px!important;height:66px!important;margin:10px 0 0 20px}
  .hdr-logo img{width:100%;height:100%;object-fit:contain}
  .hdr-cart{position:absolute!important;top:28px;right:68px;width:40px!important;height:30px!important}
  .hdr-cart img{top:7px;left:13px;width:20px;height:14.9px}
  .hdr-line{width:100%!important;height:1px!important;margin:10px 0 0!important}

  .hamburger{position:absolute!important;top:21px;right:14px;width:44px;height:44px;
             display:flex;flex-direction:column;align-items:center;justify-content:center;
             gap:5px;z-index:60}
  .hamburger span{display:block;width:24px;height:2px;border-radius:2px;background:var(--ink);
                  transition:transform .28s ease,opacity .18s ease}
  body.menu-open .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.menu-open .hamburger span:nth-child(2){opacity:0}
  body.menu-open .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  .hdr-nav{position:absolute;top:100%;left:0;width:100%;z-index:55;
           display:flex;flex-direction:column;padding:0 20px;background:#fff;
           box-shadow:0 20px 44px rgba(0,0,0,.10);
           max-height:0;opacity:0;overflow:hidden;pointer-events:none;
           transition:max-height .34s ease,opacity .22s ease,padding .34s ease}
  body.menu-open .hdr-nav{max-height:240px;opacity:1;pointer-events:auto;padding:4px 20px 14px}
  .hdr-nav .nav-link{position:static!important;width:auto!important;
                     padding:16px 2px;border-bottom:1px solid rgba(0,0,0,.10)}
  .hdr-nav .nav-link:last-child{border-bottom:none}

  /* ---------- Section shells ---------- */
  .ld-hero,.ld-top,.ld-must,.pr-intro,.ce,.pd-hero,.pd-about,.ck-hero,.ck-ship,.ck-pay,.ct-hero,.ct-form{
    display:flex;flex-direction:column;padding:30px 20px 0}
  /* heading first, art after the call to action */
  .ld-hero-h{order:1}
  .ld-hero-body{order:2;margin-top:12px}
  .ld-hero-btn{order:3}
  .ld-hero-img{order:4}
  .ct-hero-h{order:1}
  .ct-hero-sub{order:2;margin-top:12px}
  .ct-hero-img{order:3}

  .ld-line19,.pr-line19,.pd-line16,.ck-line16,.ct-line19{
    width:100%!important;height:1px!important;margin:28px 0 0}

  /* ---------- Landing ---------- */
  .ld-hero-btn{width:100%!important;max-width:300px;margin-top:22px;border-radius:50px}
  .ld-hero-img{width:100%!important;height:auto!important;margin:24px 0 0;
               aspect-ratio:615/515;object-fit:cover;border-radius:20px}
  .ct-hero-img{width:100%!important;height:auto!important;margin:24px 0 0;
               aspect-ratio:615/515;object-fit:cover;border-radius:20px}
  .ld-top-h{width:auto!important;text-align:center}
  .ld-must{align-items:flex-start}
  .ld-must-h{order:1;width:auto!important}
  .ld-what{order:2;width:auto!important;margin-top:12px}
  .ld-must-btn{order:3;width:100%!important;max-width:300px;margin-top:20px;border-radius:36.5px}
  .ld-must-img{order:4;width:100%!important;height:auto!important;margin:24px auto 0;
               max-width:300px;aspect-ratio:640/652;object-fit:cover;border-radius:28px}

  /* ---------- Products / Cart intros ---------- */
  .pr-h,.ce-h{width:auto!important;text-align:center}
  .pr-sub,.ce-sub{width:auto!important;margin-top:12px;text-align:center}
  .ce-btn{width:100%!important;max-width:300px;margin:22px auto 0;border-radius:50px}

  /* ---------- Product grid ---------- */
  .pgrid{display:flex;flex-direction:column;gap:44px;padding:30px 20px 0}
  .pgrid-all{display:flex;flex-direction:column;align-items:center;gap:44px;padding:30px 20px 0}
  .pcard,.pcard-flow{position:relative;display:flex;flex-direction:column;align-items:center;width:100%}
  .pcard-flow{width:100%!important;max-width:300px}
  .pg-products-all .pr-intro-flow{padding:30px 20px 0}
  .pg-products-all .ftr{margin:30px 16px 24px}
  /* the panel keeps Figma's 375:376 ratio but is capped so it never runs the
     full width; the art sits inside it at Figma's own proportions */
  .pc-bg{position:relative!important;width:100%!important;max-width:268px;
         height:auto!important;aspect-ratio:375/376;margin:0 auto;border-radius:22px}
  .pc-img{position:absolute!important;left:50%!important;transform:translateX(-50%)}
  .pc-img-a{top:18.6%!important;width:79.5%!important;height:auto!important}
  .pc-img-b{top:22.6%!important;width:72.3%!important;height:auto!important}
  .pc-img-c{top:21%!important;width:82.4%!important;height:auto!important}
  .pc-chip{position:static!important;width:170px!important;height:40px!important;
           margin:14px auto 0;order:2;display:flex;align-items:center;justify-content:center}
  .pc-price{position:static!important;width:auto!important;height:auto!important;
            line-height:normal}
  .pc-name{position:static!important;width:auto!important;font-size:20px;
           margin-top:12px;text-align:center;order:3}
  .pc-cart{position:static!important;width:120px!important;height:40px!important;
           margin-top:10px;order:4;display:flex;align-items:center;justify-content:center}
  .pc-cart img{position:static;width:15px;height:19.25px}
  .pc-cart.added{transform:scale(.93);transition:transform .15s ease}

  /* ---------- Detail / checkout product block ---------- */
  .pd-panel,.ck-panel{position:relative!important;width:100%!important;max-width:280px;
    height:auto!important;aspect-ratio:375/510;margin:0 auto;order:1;border-radius:22px}
  .pd-img,.ck-img{position:absolute!important;top:20%!important;left:50%!important;
                  transform:translateX(-50%);width:91%!important;height:auto!important}
  .pd-title,.ck-title{order:2;width:auto!important;margin-top:18px;text-align:center;font-size:20px}
  .pd-desc,.ck-desc{order:3;width:auto!important;margin-top:10px}
  .pd-price,.ck-price{order:4;width:auto!important;margin-top:12px;text-align:center}
  .pd-qty,.ck-qty{order:5;position:relative!important;width:100%!important;max-width:248px;
                  height:52px!important;margin:18px auto 0}
  .pd-minus,.ck-minus{position:absolute;top:50%!important;left:22px!important;
                      transform:translateY(-50%);width:22px!important;height:3px!important}
  .pd-num,.ck-num{position:absolute!important;top:50%!important;left:50%!important;
                  transform:translate(-50%,-50%);width:auto!important;height:auto!important}
  .pd-plus,.ck-plus{position:absolute;top:50%!important;left:auto!important;right:22px;
                    transform:translateY(-50%);width:22px!important;height:22px!important}
  .pd-cartbox,.ck-removebox{position:relative!important;order:6;width:100%!important;
    max-width:248px;height:52px!important;margin:12px auto 0}
  .pd-cartbox img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:26px;height:28.9px}
  .ck-remove-l{position:absolute;top:50%;left:0;transform:translateY(-50%);
               width:100%!important;height:auto!important;line-height:normal;font-size:14px}
  .pd-vec{display:none}

  /* ---------- Detail about ---------- */
  .pd-about-h{width:auto!important}
  .pd-about-b{width:auto!important;margin-top:12px}
  .pd-img1,.pd-img2{width:100%!important;height:auto!important;margin:22px auto 0;
                    object-fit:cover;border-radius:18px}
  .pd-img1{max-width:300px;aspect-ratio:513/519}
  .pd-img2{aspect-ratio:1045/461}

  /* ---------- Checkout form ---------- */
  .ck-ship,.ck-pay,.ct-form{flex-direction:row;flex-wrap:wrap;column-gap:12px;align-items:flex-start}
  .ck-ship>*,.ck-pay>*,.ct-form>*{width:100%}
  .ck-ship-h,.ck-pay-h,.ct-form-h{width:100%!important;text-align:center}
  .ck-ship-s,.ct-form-sub{width:100%!important;margin-top:10px;text-align:center}
  .field{width:100%!important;height:50px!important;font-size:14px;padding:0 16px;margin-top:12px}
  .ck-f1,.ck-f2,.ck-f15,.ck-f16,.ct-f1,.ct-f2{width:calc(50% - 6px)!important}
  .ck-plus-h,.ck-plus-v{display:none}
  .ck-check-row,.ck-agree-row{display:flex;align-items:flex-start;gap:10px;margin-top:20px}
  .cbx{position:static!important;width:18px!important;height:18px!important;flex:0 0 18px;margin-top:2px}
  .ck-cb1-l,.ck-agree{position:static!important;width:auto!important}
  .ck-whatis{margin-top:12px;text-decoration:underline}
  .ck-terms{margin-top:20px}
  .ck-co-btn{width:100%!important;margin-top:22px;border-radius:38px}
  .ct-send{width:100%!important;margin-top:22px}
  .ck-secure{width:210px!important;height:auto!important;margin:20px auto 0}

  /* ---------- Footer — the cream panel becomes a full-width block ---------- */
  .ftr{display:flex;flex-direction:column;width:auto!important;height:auto!important;
       margin:30px 16px 24px;padding:28px 22px 30px;border-radius:28px}
  .ftr p{width:auto!important;font-size:14px;line-height:22px}
  .ftr-addr{order:1}
  .ftr-email{order:2;margin-top:10px}
  .ftr-phone{order:3;margin-top:10px}
  .ftr-fda{order:4;margin-top:18px;font-size:12px!important;line-height:19px!important}
  .ftr-links{order:5;display:flex;flex-wrap:wrap;gap:12px 18px;margin-top:20px}
  .ftr-links a{position:static!important;width:auto!important}
  .ftr-line{order:6;width:100%!important;height:1px!important;margin:20px 0 0}
  .ftr-copy{order:7;margin-top:18px}
}

/* ---------- Small phones ---------- */
@media (max-width:389.98px){
  .h-80{font-size:27px;line-height:33px}
  .h-70{font-size:26px;line-height:32px}
  .h-55{font-size:24px;line-height:30px}
  .hdr-logo{width:116px!important;height:58px!important}
  .pc-bg{max-width:238px}
  .ck-f1,.ck-f2,.ck-f15,.ck-f16,.ct-f1,.ct-f2{width:100%!important}
}

/* ============================================================
   CART FLOW + LEGAL + PRODUCT OPTIONS + VALIDATION
   ============================================================ */
.pcard{display:block;color:inherit}
.pcard .pc-cart{z-index:2}

.pkg-opts{
  position:absolute;top:530px;left:684px;width:460px;
  list-style:none;display:flex;flex-wrap:wrap;gap:10px;z-index:5
}
.pkg-bx{
  flex:1 1 120px;padding:12px 14px;border:1px solid var(--field-line);
  border-radius:12px;cursor:pointer;background:#fff;
  font-family:'Manrope',sans-serif;font-size:14px;color:var(--ink)
}
.pkg-bx.active,.pkg-bx:hover{border-color:var(--mint);background:rgba(161,214,189,.18)}
.pkg-bx .pck-prc{display:block;font-weight:700;margin-top:4px}
.pd-hero:has(.pkg-opts) .pd-cartbox{top:720px}
.pd-hero:has(.pkg-opts) .pd-vec{top:980px}
.pd-hero:has(.pkg-opts) ~ .pd-line16{top:1020px}
.pd-points{position:absolute;top:1280px;left:214px;width:407px;padding-left:18px;color:var(--body)}
.pd-points li{margin-bottom:8px}

.cart-flow{position:relative;padding:180px 80px 40px;width:100%;box-sizing:border-box}
.cart-flow-title,.pg-cart-flow .ce-h{
  position:static!important;width:auto!important;text-align:center;margin:0 auto 24px
}
.pg-cart-flow .ce-sub{position:static!important;width:auto!important;max-width:520px;margin:0 auto 24px;text-align:center}
.pg-cart-flow .ce-btn,.cart-browse{
  position:static!important;display:inline-flex!important;width:310px;height:73px;border-radius:50px;margin:12px auto
}
#cartBox{text-align:center}
#cartBox .nt-txt{display:block;margin-bottom:8px}

.cart-box1,.cart-box2,.card-box3,.card-box4{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  max-width:1100px;margin:0 auto 16px;padding:18px 22px;
  background:#fff;border:1px solid var(--rule);border-radius:18px;text-align:left
}
.cart-box1{font-family:'Manrope',sans-serif;font-weight:700;color:var(--ink);background:var(--ftr-bg)}
.cart-box2 .cart-prd1{width:72px;height:72px;object-fit:contain;display:inline-block;vertical-align:middle;margin-right:12px}
.cart-box2 .one{flex:1;display:flex;align-items:center}
.cart-prdname{font-family:'Manrope',sans-serif;font-weight:600;color:var(--ink)}
.cart-prdname .span2{display:block;font-weight:400;font-size:14px;color:#666}
.cart-remv{width:18px;height:18px;margin-left:10px;vertical-align:middle}
.card-box3{justify-content:flex-end}
.cart-prclist{list-style:none;font-size:16px;color:var(--body)}
.cart-prclist li{margin:6px 0;display:flex;justify-content:space-between;gap:40px}
.cart-prclist .span2{font-weight:700}
.card-box4{justify-content:flex-start;flex-wrap:wrap;border:0;background:transparent;padding:0}
.continue-shpbtn,.continue-shpbtn1{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:180px;height:52px;padding:0 22px;margin:6px 8px 6px 0;
  background:var(--mint);border-radius:50px;font-family:'Manrope',sans-serif;font-weight:700;color:var(--ink)
}
.continue-shpbtn1{background:#eceae6}
.cart-prd-opt{max-width:1100px;margin:28px auto;display:flex;flex-wrap:wrap;gap:20px}
.upsell-box{flex:1 1 280px}
.offerBox{
  position:relative;display:flex;align-items:flex-start;gap:12px;
  padding:18px;border:1px solid var(--rule);border-radius:18px;background:var(--panel-pd)
}
.offerBox input[type=checkbox]{width:20px;height:20px;margin-top:6px;flex:0 0 20px}
.offrBx-img1{width:70px;height:70px;object-fit:contain}
.up-txt{font-family:'Manrope',sans-serif;font-weight:700;color:var(--ink)}
.up-txt span{display:block;font-size:12px;font-weight:600;color:#888;margin-bottom:4px}
.sec1-shopnow{margin-top:8px;font-weight:700;color:var(--ink)}
.remove-from-cart{display:inline-block;margin-top:8px;font-size:14px;text-decoration:underline;color:#a33}

.checkout-panel{max-width:1320px;margin:40px auto 0;position:relative}
.pg-cart-flow.pg-checkout .ck-ship-flow,
.pg-cart-flow.pg-checkout .ck-pay-flow{
  position:relative;display:grid;
  grid-template-columns:repeat(12,1fr);gap:16px 18px;
  padding:20px 0 10px
}
.pg-cart-flow .ck-ship-h,.pg-cart-flow .ck-pay-h,
.pg-cart-flow .ck-ship-s,.pg-cart-flow .ck-terms,
.pg-cart-flow .ck-whatis,.pg-cart-flow .ck-secure,
.pg-cart-flow .ck-check-row,.pg-cart-flow .ck-agree-row,
.pg-cart-flow .ck-co-btn{
  position:static!important;width:auto!important;grid-column:1/-1
}
.pg-cart-flow .ck-ship-h,.pg-cart-flow .ck-pay-h{text-align:left;line-height:1.2;margin-top:12px}
.pg-cart-flow .ck-ship-s{max-width:640px}
.pg-cart-flow .field{
  position:static!important;width:100%!important;height:64px;grid-column:span 6
}
.pg-cart-flow .ck-f5,.pg-cart-flow .ck-f9,
.pg-cart-flow .ck-f13,.pg-cart-flow .ck-f14{grid-column:1/-1}
.pg-cart-flow .ck-f6,.pg-cart-flow .ck-f7,.pg-cart-flow .ck-f8,
.pg-cart-flow .ck-f10,.pg-cart-flow .ck-f11,.pg-cart-flow .ck-f12,
.pg-cart-flow .ck-f15,.pg-cart-flow .ck-f16,.pg-cart-flow .ck-f17{grid-column:span 4}
.pg-cart-flow .ck-check-row,.pg-cart-flow .ck-agree-row{
  display:flex;align-items:flex-start;gap:12px;margin:12px 0;padding:4px 0
}
.pg-cart-flow .ck-cb1-l,.pg-cart-flow .ck-agree{position:static!important;width:auto!important}
.pg-cart-flow .billing-info-block{
  grid-column:1/-1;display:grid;grid-template-columns:repeat(12,1fr);gap:16px 18px
}
.pg-cart-flow .ck-plus-h,.pg-cart-flow .ck-plus-v{display:none}

/* Custom checkbox UI (span-based — works in all browsers) */
.ck-check-label{
  display:flex;align-items:flex-start;gap:12px;cursor:pointer;
  font-family:'Inter Display','Inter',sans-serif;font-size:16px;line-height:1.4;color:var(--body);
  user-select:none
}
.ck-check-label .cbx-input{
  position:absolute!important;opacity:0;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)
}
.ck-check-label .cbx-box{
  position:relative;flex:0 0 22px;width:22px;height:22px;margin-top:1px;
  background:#fff;border:1.5px solid var(--field-line);border-radius:5px;
  box-sizing:border-box;transition:border-color .15s ease, background .15s ease
}
.ck-check-label .cbx-box::after{
  content:'';position:absolute;left:7px;top:2px;width:5px;height:11px;
  border:solid transparent;border-width:0 2px 2px 0;transform:rotate(45deg)
}
.ck-check-label .cbx-input:checked + .cbx-box{
  background:var(--mint);border-color:#7cc2a4
}
.ck-check-label .cbx-input:checked + .cbx-box::after{
  border-color:var(--ink)
}
.ck-check-label .cbx-input:focus-visible + .cbx-box{
  outline:2px solid #7cc2a4;outline-offset:2px
}
.ck-check-label .ck-check-text{flex:1;min-width:0}
.ck-check-label .ck-check-text a{text-decoration:underline;text-underline-position:from-font}

.pg-cart-flow .ck-co-btn{width:320px!important;height:73px;border-radius:38px;margin-top:8px}
.pg-cart-flow .ck-co-btn:disabled,
.pg-cart-flow .ck-co-btn[disabled]{
  opacity:.45;cursor:not-allowed;pointer-events:none;filter:grayscale(.25)
}
.pg-cart-flow .ck-secure{width:265px;height:auto;margin-top:12px}

.formError,.ui-state-error{
  border-color:#dd528b!important;outline:1px solid #dd528b
}
.ck-agree-row.formError,.ck-check-row.formError{
  outline:1px solid #dd528b;border-radius:8px;padding:8px
}
.ck-agree-row.formError .ck-check-text{color:#dd528b}
.ck-agree-row.formError .cbx-box{border-color:#dd528b}


#pop_overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:99999;
  display:flex;align-items:center;justify-content:center
}
#pop_content{
  position:relative;background:#fff;padding:28px 32px;border-radius:16px;
  max-width:420px;margin:20px
}
#pop_content .cross{
  position:absolute;top:8px;right:12px;font-size:28px;line-height:1;cursor:pointer
}
.popup-loading-wrapper{
  position:fixed;inset:0;background:rgba(255,255,255,.85);
  display:flex;align-items:center;justify-content:center;text-align:center
}

.legal-wrap{
  max-width:980px;margin:180px auto 40px;padding:0 24px
}
.legal-h{margin-bottom:24px}
.trm-bx h3,.trm-bx h4{margin:22px 0 10px;font-family:'Mona Sans',sans-serif}
.trm-bx p,.trm-bx li{margin-bottom:12px;line-height:1.55}
.trm-bx a{text-decoration:underline}
.ct-meta{position:static;grid-column:1/-1;margin-top:8px;text-align:center;width:100%}

@media (max-width:767.98px){
  .pkg-opts{position:static!important;width:100%!important;margin-top:18px;padding:0 4px}
  .pd-points{position:static!important;width:auto!important;margin-top:16px}
  .cart-flow{padding:30px 16px 20px}
  .cart-box1,.cart-box2{flex-direction:column;align-items:flex-start}
  .cart-prd-opt{flex-direction:column}
  .pg-cart-flow .field,
  .pg-cart-flow .ck-f6,.pg-cart-flow .ck-f7,.pg-cart-flow .ck-f8,
  .pg-cart-flow .ck-f10,.pg-cart-flow .ck-f11,.pg-cart-flow .ck-f12,
  .pg-cart-flow .ck-f15,.pg-cart-flow .ck-f16,.pg-cart-flow .ck-f17{grid-column:1/-1}
  .pg-cart-flow .ck-co-btn{width:100%!important}
  .pg-cart-flow .checkout-panel{padding:0 4px}
  .legal-wrap{margin-top:30px;padding:0 16px}
  .pg-cart-flow .ftr,.pg-legal .ftr,.pg-products-all .ftr{margin:30px 16px 24px;width:auto!important}
  .pg-products-all .pr-intro-flow{padding:30px 20px 0}
  .pg-products-all .canvas,
  .pg-cart-flow .canvas,
  .pg-legal .canvas{width:100%!important;max-width:none}
}