.pgrid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:64px; align-items:start }
.gal-main{ background:linear-gradient(165deg,#ffffff,#d6ecea); border-radius:26px; height:480px;
           display:flex; align-items:center; justify-content:center; border:1px solid var(--line) }
.gal-main img{ max-height:80%; filter:drop-shadow(0 30px 40px rgba(14,60,52,.25)) }
.bigline{ background:rgba(255,255,255,.75); border:2px solid var(--teal); border-radius:18px; padding:18px 22px;
          font-size:16px; font-weight:700; margin:24px 0 }
.get{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:12px }
.get li{ display:flex; gap:12px; align-items:baseline; font-size:15px; line-height:1.55; color:#3d4f4b }
.get li span{ color:var(--teal); font-weight:700 }
.cmp{ display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:44px }
.cmp .card{ padding:26px }
.cmp .hd{ font-weight:700; font-size:16px; margin-bottom:6px }
.cmp .pr{ font-family:'Instrument Serif',serif; font-size:34px; color:var(--teal) }
.cmp p{ font-size:13.5px; color:var(--muted); line-height:1.55; margin:8px 0 0 }
@media (max-width:980px){ .pgrid{ grid-template-columns:1fr; gap:34px } .gal-main{ height:340px } .cmp{ grid-template-columns:1fr } }
.addbtn{ display:flex; align-items:center; justify-content:center; gap:10px; transition:transform .15s ease, background .2s ease }
.addbtn .ab-ring{ width:18px; height:18px; opacity:0; transition:opacity .2s }
.addbtn .ab-ring circle{ stroke-dasharray:56.5; stroke-dashoffset:56.5 }
.addbtn.adding{ transform:scale(.98) }
.addbtn.adding .ab-ring{ opacity:1 }
.addbtn.adding .ab-ring circle{ stroke-dashoffset:0; transition:stroke-dashoffset .5s ease }
.shipline{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--muted); margin-top:14px }
.shipline b{ color:var(--teal) }
.shipline .dot{ width:7px; height:7px; border-radius:50%; background:var(--teal); animation:shipPulse 2.2s ease-in-out infinite }
@keyframes shipPulse{ 0%,100%{opacity:1} 50%{opacity:.3} }
.guarantee{ display:flex; gap:16px; align-items:flex-start; background:rgba(255,255,255,.75);
            border:1px solid var(--line); border-radius:18px; padding:20px 22px; margin-top:18px }
.guarantee img{ width:34px; height:34px; flex:none }
.guarantee .hd{ font-weight:700; font-size:15px; margin-bottom:4px }
.guarantee p{ font-size:13.5px; line-height:1.6; color:var(--muted); margin:0 }
.drawer-ov{ position:fixed; inset:0; z-index:110; background:rgba(7,13,12,.5); opacity:0; pointer-events:none; transition:opacity .3s ease }
.drawer-ov.on{ opacity:1; pointer-events:auto }
.drawer{ position:fixed; top:0; right:0; bottom:0; z-index:120; width:min(420px,92vw); background:var(--paper-hi);
         border-left:1px solid var(--line); box-shadow:-20px 0 60px rgba(14,60,52,.15);
         transform:translateX(105%); transition:transform .4s cubic-bezier(.22,.8,.3,1);
         display:flex; flex-direction:column; padding:26px 28px }
.drawer.on{ transform:none }
.drawer .dh{ display:flex; justify-content:space-between; align-items:center; margin-bottom:22px }
.drawer .dh .t{ font-weight:700; font-size:16px }
.drawer .dx{ background:none; border:none; font-size:26px; color:var(--muted); cursor:pointer; line-height:1; padding:4px }
.drawer .item{ display:flex; gap:16px; align-items:center; padding:18px; background:rgba(255,255,255,.7);
               border:1px solid var(--line); border-radius:18px }
.drawer .th{ flex:none; width:76px; height:76px; border-radius:14px; background:linear-gradient(165deg,#ffffff,#e2f1ee);
             display:flex; align-items:center; justify-content:center }
.drawer .th img{ max-height:82% }
.drawer .nm{ font-weight:700; font-size:14.5px }
.drawer .pl{ font-size:12.5px; color:var(--muted); margin-top:3px }
.drawer .pr{ font-family:'Instrument Serif',serif; font-size:21px; color:var(--teal); margin-left:auto }
.drawer .ship{ display:flex; gap:8px; align-items:center; font-size:12.5px; color:var(--muted); margin:16px 2px }
.drawer .ship b{ color:var(--teal) }
.drawer .foot{ margin-top:auto }
.drawer .srow{ display:flex; justify-content:space-between; font-size:14.5px; padding:8px 0; color:#3d4f4b }
.drawer .srow.total{ border-top:1px solid rgba(14,117,104,.25); padding-top:14px; font-weight:700; color:var(--ink); font-size:16px }

.trial-purchase-note{margin:10px 0 0;text-align:center;font-size:13px;font-weight:600;color:var(--teal)}
