body{margin:0;background:#08040e;color:#fff;font-family:Arial,sans-serif}
.wrap{max-width:1100px;margin:auto;padding:28px clamp(16px,4vw,32px)}
.back{color:#fff;text-decoration:none;font-weight:bold}
.hero{display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:clamp(24px,4vw,52px);padding:clamp(40px,7vw,84px) 0;background:radial-gradient(ellipse at 76% 36%,#522077,transparent 56%)}
.eyebrow{color:#e9a5ff;text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:bold}
h1{font-size:clamp(2.55rem,6.2vw,5rem);font-style:italic;text-transform:uppercase;line-height:.93;margin:16px 0}
h1 strong{display:block;color:#e259ff}
p{font-size:1rem;line-height:1.55;color:#e2d9e9;max-width:64ch}
.hero p{font-size:1.16rem}
.btn{display:inline-block;padding:13px 19px;border-radius:9px;background:linear-gradient(135deg,#6412ba,#9c1ec3);color:#fff;text-decoration:none;font-weight:bold}
:focus-visible{outline:3px solid #e8a0ff;outline-offset:4px}
.preview{margin:0;min-width:0;text-align:center}
.tv{position:relative;padding:7px;border:1px solid #84818d;border-radius:11px;background:linear-gradient(135deg,#58545f,#100e14 25%,#35313c 80%,#75717c);box-shadow:0 20px 40px #000a,0 0 38px #a33bea4d}
.tv::after{content:"";position:absolute;bottom:2px;left:50%;width:4px;height:2px;background:#cf87fb;border-radius:100%}
.sample-ad{position:relative;isolation:isolate;box-sizing:border-box;aspect-ratio:16/9;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:clamp(6px,1.5vw,18px);padding:8%;text-align:left;color:#fff0db;border-radius:5px;background:linear-gradient(117deg,#241329 48%,transparent 82%),radial-gradient(circle at 83% 30%,#efac74,#84465d 31%,#3d2148 65%);overflow:hidden}
.sample-ad strong{font-family:Georgia,serif;font-size:clamp(1.35rem,3.6vw,2.95rem);line-height:1.03}
.sample-ad span{font-size:clamp(.62rem,1.25vw,.84rem);font-weight:bold}
.preview figcaption{color:#ddd1e3;font-size:.8rem;margin-top:14px}
.tiles,.packages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.packages{grid-template-columns:repeat(4,minmax(0,1fr))}
.tile{padding:20px;border:1px solid #785485;border-radius:12px;background:linear-gradient(150deg,#231633,#140d1e);transition:border-color .2s,box-shadow .2s}
.tile:hover{border-color:#c779ee;box-shadow:0 0 18px #ad49ef35}
.tile b{color:#ed9bff}
.tile h2,.tile h3{font-size:1.2rem;margin:12px 0 8px}
.tile p{margin:0}
.details{padding-top:clamp(42px,7vw,72px)}
.details h2{font-size:clamp(1.7rem,4vw,2.5rem);margin:10px 0 18px}
.process{padding-left:1.7em;color:#e2d9e9;line-height:1.55}
.process li{padding:5px 0 5px 7px}
.process li::marker{color:#e9a5ff;font-weight:bold}
.notice{border-left:3px solid #c779ee;background:#21142d;padding:14px 18px}
@media(max-width:760px){.hero{grid-template-columns:1fr}.preview{max-width:540px}.packages{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.tiles{grid-template-columns:1fr}}
@media(max-width:390px){.packages{grid-template-columns:1fr}}

.coffee{position:absolute;z-index:-1;right:4%;bottom:9%;width:34%;filter:drop-shadow(0 6px 12px #28111e9c)}
