.cc-diy{--cc-diy-navy: #214057;--cc-diy-sky: #cce5ff;--cc-diy-mist: #f5faff;--cc-diy-orange: #e8ab61;--cc-diy-border: rgba(33, 64, 87, .14);--cc-diy-muted: rgba(33, 64, 87, .7);color:var(--cc-diy-navy);background:#fff}.cc-diy__hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 19rem;align-items:center;gap:2rem;min-height:14.5rem;padding:clamp(1.7rem,2.1vw,2.2rem) clamp(2rem,3vw,3rem);border-radius:1.8rem;background:radial-gradient(circle at 75% 0,rgba(255,255,255,.62),transparent 28%),linear-gradient(135deg,#cce5ff,#b8dbff)}.cc-diy__hero:after{content:"";position:absolute;right:-4rem;bottom:-13rem;width:26rem;height:26rem;border:3.2rem solid rgba(255,255,255,.25);border-radius:50%}.cc-diy__eyebrow{margin:0 0 .45rem;color:var(--cc-diy-navy);font-size:1.2rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.cc-diy__hero h1{max-width:18ch;margin:0;color:var(--cc-diy-navy);color:#fff;font-family:CC Bangers,Arial Black,sans-serif;font-size:clamp(3.4rem,3.8vw,4.8rem);font-weight:400;line-height:.95;letter-spacing:.015em;-webkit-text-stroke:1.2px var(--cc-diy-navy);paint-order:stroke fill;text-shadow:2px 3px 0 var(--cc-diy-navy)}.cc-diy__intro{max-width:68rem;margin:.7rem 0 0;color:var(--cc-diy-muted);font-size:clamp(1.2rem,1.2vw,1.4rem);line-height:1.4}.cc-diy__hero-mark{position:relative;z-index:1;width:19rem;justify-self:end}.cc-diy__hero-mark img{display:block;width:100%;height:auto}.cc-diy__layout{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(36rem,.82fr);gap:clamp(1.6rem,3vw,3rem);align-items:start;margin-top:2.4rem}.cc-diy__form,.cc-diy__result{border:1px solid var(--cc-diy-border);border-radius:2.4rem;background:#fff;box-shadow:0 1.6rem 4rem #21405712}.cc-diy__form{overflow:hidden}.cc-diy__step{padding:clamp(2rem,3vw,3rem);border-bottom:1px solid var(--cc-diy-border)}.cc-diy__step-heading{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.2rem;align-items:start}.cc-diy__step-visual{position:relative;display:grid;width:5rem;height:5rem;place-items:center;border:1px solid rgba(33,64,87,.12);border-radius:1.5rem;background:var(--cc-diy-mist)}.cc-diy__step-visual svg{width:3.5rem;height:3.5rem;fill:none;stroke:var(--cc-diy-navy);stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4}.cc-diy__step-visual .cc-diy__step-accent{fill:var(--cc-diy-orange);stroke:var(--cc-diy-orange);opacity:.9}.cc-diy__step-visual small{position:absolute;top:-.7rem;right:-.7rem;display:grid;width:2.2rem;height:2.2rem;place-items:center;border:.25rem solid #fff;border-radius:50%;background:var(--cc-diy-navy);color:#fff;font-size:1rem;font-weight:900}.cc-diy__step h2{margin:0;color:var(--cc-diy-navy);font-family:CC Bangers,Arial Black,sans-serif;font-size:clamp(2.6rem,2.4vw,3.2rem);font-weight:400;line-height:1;letter-spacing:.015em}.cc-diy__step-heading p{margin:.25rem 0 0;color:var(--cc-diy-muted);font-size:1.25rem;line-height:1.4}.cc-diy__presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin-top:1.6rem}.cc-diy__presets[data-cc-presets=nicotine]{grid-template-columns:repeat(6,minmax(0,1fr))}.cc-diy__presets button{min-height:4.6rem;border:1px solid var(--cc-diy-border);border-radius:1.2rem;background:#fff;color:var(--cc-diy-navy);font:inherit;font-weight:500;cursor:pointer;transition:.16s ease}.cc-diy__presets button:hover{border-color:var(--cc-diy-navy);background:var(--cc-diy-mist)}.cc-diy__presets button.is-selected{border-color:var(--cc-diy-navy);background:var(--cc-diy-navy);color:#fff;box-shadow:0 .7rem 1.8rem #21405726}.cc-diy__field{display:grid;grid-template-columns:minmax(0,1fr) minmax(13rem,17rem);gap:1rem;align-items:center;margin-top:1.4rem;color:var(--cc-diy-muted);font-size:1.2rem;font-weight:500}.cc-diy__input-unit{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:4.6rem;border:1px solid var(--cc-diy-border);border-radius:1.2rem;background:#fff}.cc-diy__input-unit:focus-within{border-color:var(--cc-diy-navy);box-shadow:0 0 0 .3rem #cce5ffcc}.cc-diy__input-unit input{width:100%;min-width:0;border:0;outline:0;background:transparent;padding:1rem 1.2rem;color:var(--cc-diy-navy);font:inherit;font-size:1.5rem;font-weight:600}.cc-diy__input-unit b{padding-right:1.2rem;color:var(--cc-diy-muted);font-size:1.1rem;font-weight:500;white-space:nowrap}.cc-diy__input-unit.is-compact{min-width:12rem}.cc-diy__range-row{display:grid;grid-template-columns:minmax(0,1fr) 12rem;gap:1.4rem;align-items:center;margin-top:1.8rem}.cc-diy__range-row>input[type=range]{width:100%;accent-color:var(--cc-diy-orange)}.cc-diy__range-scale{display:flex;justify-content:space-between;gap:1rem;margin-top:.6rem;color:var(--cc-diy-muted);font-size:1rem}.cc-diy__advanced{padding:1.7rem clamp(2rem,3vw,3rem);background:var(--cc-diy-mist)}.cc-diy__advanced summary{color:var(--cc-diy-navy);font-weight:600;cursor:pointer}.cc-diy__advanced p{margin:.8rem 0 0;color:var(--cc-diy-muted);font-size:1.1rem;line-height:1.45}.cc-diy__result{position:sticky;top:2rem;overflow:hidden;padding:clamp(2.2rem,3vw,3.2rem)}.cc-diy__result-top{text-align:center}.cc-diy__result-top h2{margin:0;color:var(--cc-diy-navy);font-family:CC Bangers,Arial Black,sans-serif;font-size:clamp(3rem,3.2vw,4rem);font-weight:400;line-height:1;letter-spacing:.015em}.cc-diy__result-top>p:last-child{margin:.7rem auto 0;color:var(--cc-diy-muted);font-size:1.2rem;line-height:1.45}.cc-diy__bottle{width:min(27rem,84%);margin:1.2rem auto 1.4rem}.cc-diy__bottle svg{display:block;width:100%;height:auto;overflow:visible}.cc-diy__bottle [data-cc-fill-base-svg],.cc-diy__bottle [data-cc-fill-booster-svg],.cc-diy__bottle [data-cc-fill-aroma-svg],.cc-diy__bottle [data-cc-liquid-wave]{transition:y .24s ease,height .24s ease,transform .24s ease}.cc-diy__recipe{display:grid;gap:.8rem}.cc-diy__recipe>div{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;align-items:center;padding:1.2rem 1.3rem;border:1px solid var(--cc-diy-border);border-radius:1.3rem;background:var(--cc-diy-mist)}.cc-diy__dot{width:1.2rem;height:1.2rem;border-radius:50%}.cc-diy__dot.is-aroma{background:var(--cc-diy-orange)}.cc-diy__dot.is-booster{background:var(--cc-diy-navy)}.cc-diy__dot.is-base{background:var(--cc-diy-sky);border:1px solid rgba(33,64,87,.12)}.cc-diy__recipe p{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.2rem 1rem;align-items:baseline;margin:0}.cc-diy__recipe small{color:var(--cc-diy-muted);font-size:1.05rem}.cc-diy__recipe strong{color:var(--cc-diy-navy);font-size:1.5rem;font-weight:600}.cc-diy__recipe em{grid-column:1/-1;color:var(--cc-diy-muted);font-size:.95rem;font-style:normal}.cc-diy__error{margin:1rem 0 0;border:1px solid rgba(150,35,25,.2);border-radius:1.2rem;background:#fff3f1;padding:1.2rem;color:#8d2118;font-size:1.1rem;line-height:1.45}.cc-diy.has-error .cc-diy__bottle{opacity:.45}.cc-diy__actions{display:grid;gap:.8rem;margin-top:1.4rem}.cc-diy__actions a,.cc-diy__actions button{display:flex;min-height:4.8rem;align-items:center;justify-content:center;border-radius:1.2rem;padding:1rem 1.4rem;font:inherit;font-weight:600;text-align:center;text-decoration:none;cursor:pointer}.cc-diy__primary{border:1px solid var(--cc-diy-orange);background:var(--cc-diy-orange);color:#fff}.cc-diy__primary:hover{background:#dc9b4e;color:#fff}.cc-diy__secondary{border:1px solid var(--cc-diy-navy);background:#fff;color:var(--cc-diy-navy)}.cc-diy__secondary:hover{background:var(--cc-diy-navy);color:#fff}.cc-diy__actions button{min-height:auto;border:0;background:transparent;color:var(--cc-diy-muted);font-size:1.05rem;text-decoration:underline}.cc-diy__notice{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;margin-top:1.8rem;border-left:.4rem solid var(--cc-diy-orange);border-radius:0 1.4rem 1.4rem 0;background:var(--cc-diy-mist);padding:1.4rem 1.6rem}.cc-diy__notice strong{color:var(--cc-diy-navy)}.cc-diy__notice p{margin:0;color:var(--cc-diy-muted);font-size:1.1rem;line-height:1.5}.cc-diy button:focus-visible,.cc-diy a:focus-visible,.cc-diy summary:focus-visible{outline:.3rem solid var(--cc-diy-sky);outline-offset:.3rem}@media screen and (max-width:989px){.cc-diy__layout{grid-template-columns:1fr}.cc-diy__result{position:static}.cc-diy__hero{grid-template-columns:minmax(0,1fr) 17rem}}@media screen and (max-width:749px){.cc-diy__hero{min-height:0;padding:2rem 1.8rem;border-radius:1.6rem}.cc-diy__hero h1{font-size:clamp(3.2rem,10vw,4.2rem)}.cc-diy__hero-mark{display:none}.cc-diy__form,.cc-diy__result{border-radius:2rem}.cc-diy__presets,.cc-diy__presets[data-cc-presets=nicotine]{grid-template-columns:repeat(3,minmax(0,1fr))}.cc-diy__field{grid-template-columns:1fr}.cc-diy__range-row{grid-template-columns:minmax(0,1fr) 10rem}.cc-diy__range-scale span:nth-child(2){display:none}.cc-diy__notice{grid-template-columns:1fr}}@media screen and (max-width:390px){.cc-diy__presets,.cc-diy__presets[data-cc-presets=nicotine]{grid-template-columns:repeat(2,minmax(0,1fr))}}
/*# sourceMappingURL=/cdn/shop/t/185/assets/section-diy-calculator.css.map */