:root{--ink:#30233f;--purple:#9da3ed;--paper:#f7f6fa;--body:'DM Sans','Helvetica Neue',Arial,sans-serif;--display:'Urbanist','Avenir Next','Helvetica Neue',Arial,sans-serif;font-family:var(--body);color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid currentColor;outline-offset:5px}button{color:inherit}a{color:inherit}.review-bar{min-height:72px;padding:14px 28px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #30233f24;background:#fff}.review-title{font-size:12px;letter-spacing:.08em;text-decoration:none;font-weight:700}.review-title span{font-weight:400;margin-left:10px}.review-bar nav{display:flex;gap:7px}.review-bar nav a{display:grid;place-content:center;min-width:44px;min-height:44px;font-size:14px;text-decoration:none;border:1px solid transparent;border-radius:50%}.review-bar nav a[aria-current]{background:var(--ink);color:white}.notes-toggle{background:none;border:0;font-size:13px;padding:12px 0}.notes-toggle::after{content:' +'}#notes{padding:22px 5vw;background:#ece9f3;font-size:15px;line-height:1.6}#notes strong{margin-right:18px}#experience{position:relative;isolation:isolate;min-height:660px;height:calc(100svh - 160px);max-height:1100px;overflow:hidden;background:#e7e2f3;transition:background 1.4s,color 1s}.brand{position:absolute;top:34px;left:4.5%;right:4.5%;display:flex;justify-content:space-between;align-items:center;z-index:5}.brand img{width:170px;height:auto}.brand>span{font-size:12px;letter-spacing:.12em}.world{position:absolute;inset:0;z-index:-1;pointer-events:none}.world>div{display:none}.copy{position:absolute;left:7%;top:27%;max-width:55%;transition:opacity .5s,transform 1s}.eyebrow{font-size:12px;letter-spacing:.15em;margin:0 0 24px}.copy h1{font-family:var(--display);font-size:clamp(50px,6vw,100px);font-weight:500;letter-spacing:-.065em;line-height:.98;margin:0}.teaser{font-size:16px;margin-top:28px;line-height:1.5}.play{position:absolute;right:10%;top:70%;background:transparent;border:0;border-bottom:1px solid currentColor;padding:12px 0;z-index:2;font-size:14px;transition:opacity .3s}.play span{margin-left:25px}.capture{position:absolute;left:7%;bottom:95px;width:min(465px,43%);z-index:4;min-height:88px}.form-shell{transition:opacity .4s,transform .8s;transform-origin:50% 100%}form{display:flex;border-bottom:1px solid currentColor;position:relative}input{width:100%;min-width:0;padding:16px 0;border:0;background:transparent;border-radius:0;color:inherit;font-size:16px}input::placeholder{color:inherit;opacity:.75}form button{white-space:nowrap;background:none;border:0;padding:16px 0 16px 20px;font-size:15px}form button span{padding-left:20px}#form-status{font-size:13px;line-height:1.4;min-height:19px;margin:10px 0 0}.confirmation{opacity:0;visibility:hidden;display:flex;gap:14px;align-items:center;position:absolute;top:6px;left:0;transition:opacity .4s .3s,transform .8s;transform:translateY(10px)}.confirmation h2{font-family:var(--display);font-size:32px;letter-spacing:-.04em;font-weight:500;margin:0}.confirm-mark{font-size:22px}.scene-footer{position:absolute;bottom:30px;left:4.5%;right:4.5%;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.09em}.preview-bar{min-height:88px;padding:16px 28px;display:flex;justify-content:space-between;align-items:center;gap:18px;background:#fff}.preview-label{font-size:12px;letter-spacing:.1em}.preview-label small{display:block;font-size:12px;font-weight:400;letter-spacing:0;margin-top:6px;opacity:.7}.preview-actions{display:flex;align-items:center;gap:12px;font-size:13px}.preview-actions select{max-width:230px;background:transparent;border:1px solid #ded9e7;min-height:44px;padding:8px}.preview-actions button{padding:12px 18px;min-height:44px;border:1px solid #d6d0df;background:white}.preview-actions #preview{background:var(--ink);color:white;border-color:var(--ink)}#preview span{margin-left:16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[data-state=success] .form-shell{opacity:0;pointer-events:none}[data-state=success] .confirmation{visibility:visible;opacity:1;transform:translateY(0)}[data-state=success] .play{opacity:0;pointer-events:none}[data-state=submitting] form{opacity:.55}

/* Selected direction: renewed skin, a quiet product composition. */
.product-art,.confirmation-detail{display:none}
[data-layout='01'] .brand>span,[data-layout='01'] .world,[data-layout='01'] .eyebrow,[data-layout='01'] .play{display:none}
[data-layout='01'] .product-art{display:block;position:absolute;margin:0;right:11%;top:13%;width:29%;height:72%;pointer-events:none}
.product-art img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(10px 18px 18px #55446b15)}
[data-layout='01'] .copy{top:30%;left:9.3%;width:45%;max-width:650px}
[data-layout='01'] .copy h1{font-size:clamp(44px,5.35vw,94px);line-height:1.06;letter-spacing:-.065em}
.typed-line{display:block;white-space:nowrap;min-height:1.06em}
.type-caret{display:inline-block;vertical-align:-.03em;width:2px;height:.78em;margin-left:8px;background:currentColor;animation:caret-blink 1.15s steps(1) infinite}
@keyframes caret-blink{0%,48%{opacity:.55}49%,100%{opacity:0}}
[data-layout='01'] .teaser{margin-top:25px;margin-bottom:0;font-size:16px}
[data-layout='01'] .capture{position:relative;left:0;bottom:auto;width:min(100%,490px);margin-top:27px;min-height:94px}
[data-layout='01'] form{padding:7px 7px 7px 24px;border:1px solid #fff9;border-radius:999px;background:#ffffffbd;box-shadow:0 5px 25px #49306409;transition:box-shadow .2s,background .2s}
[data-layout='01'] form:focus-within{background:#fff;box-shadow:0 0 0 3px #9da3ed70}
[data-layout='01'] input{padding:14px 0;outline-offset:1px}
[data-layout='01'] form button{background:var(--ink);color:white;border-radius:999px;padding:16px 22px;min-height:50px}
[data-layout='01'] #form-status{padding-left:24px}
[data-layout='01'] .confirmation{display:block;top:0;transform:none;transition:opacity .55s}
[data-layout='01'] .confirmation .confirm-mark{display:none}
[data-layout='01'] .confirmation h2{font:500 clamp(21px,2vw,28px)/1.25 var(--display);letter-spacing:-.025em}
[data-layout='01'] .confirmation-detail{display:block;font-size:16px;line-height:1.5;margin:8px 0 0}
[data-layout='01'][data-state=success] .teaser{visibility:hidden}
[data-layout='01'][data-state=success] .form-shell{transform:none}
@media(max-width:800px){
  #experience[data-layout='01']{height:850px;min-height:850px}
  [data-layout='01'] .copy{left:7%;top:122px;width:86%;max-width:none}
  [data-layout='01'] .copy h1{font-size:clamp(36px,10.7vw,70px)}
  [data-layout='01'] .teaser{font-size:15px;margin-top:23px}
  [data-layout='01'] .capture{margin-top:22px;width:100%;max-width:490px}
  [data-layout='01'] form{padding-left:18px}
  [data-layout='01'] form button{padding:14px 18px;font-size:14px}
  [data-layout='01'] .product-art{top:auto;bottom:65px;right:20%;width:60%;height:350px}
}
@media(prefers-reduced-motion:reduce){.type-caret{display:none}}
[data-layout='01'] .form-shell{transition:opacity .18s}
[data-layout='01'] .confirmation{transition:opacity .4s .2s}

/* Cloud texture and grounded product treatment from the latest Purpology PDP. */
#experience[data-layout='01']{
  background:
    radial-gradient(ellipse 65% 80% at 43% 48%,#ffffff8c 0%,#ffffff40 48%,transparent 80%),
    linear-gradient(180deg,#f8faff66,#f8f7ff85),
    url('assets/lavender-clouds.webp') center/cover no-repeat,#edf1fc;
}
[data-layout='01'] .scene-footer>span:first-child{display:none}
[data-layout='01'] .scene-footer{justify-content:flex-end;left:9.3%;right:9.3%}
[data-layout='01'] .brand{left:9.3%;right:9.3%;top:38px}
[data-layout='01'] .brand img{width:170px;display:block}
[data-layout='01'] .renewed-title{color:#69529b}
[data-layout='01'] .typed-line{color:#30233f}
[data-layout='01'] .product-art{
  --bottle-height:clamp(330px,59vh,640px);
  isolation:isolate;top:50%;right:11%;bottom:auto;
  height:var(--bottle-height);width:calc(var(--bottle-height) * .8);
  transform:translateY(-50%);
}
[data-layout='01'] .product-art img{
  position:relative;z-index:1;transform-origin:50% 98%;
  filter:drop-shadow(9px 12px 10px #49335d1a);
  animation:product-sway 7s ease-in-out infinite;
}
[data-layout='01'] .product-art::before,
[data-layout='01'] .product-art::after{content:'';position:absolute;pointer-events:none;z-index:0}
[data-layout='01'] .product-art::before{
  left:50%;bottom:.1%;width:53%;height:5.5%;
  transform:translateX(-50%);
  background:radial-gradient(ellipse,#35244250 0%,#4a335a26 37%,transparent 72%);
  filter:blur(2px);animation:contact-breathe 7s ease-in-out infinite;
}
[data-layout='01'] .product-art::after{
  left:42%;bottom:-.7%;width:77%;height:9%;transform:rotate(-9deg);transform-origin:10% 50%;
  background:radial-gradient(ellipse,#4731542e 0%,#59446512 45%,transparent 72%);filter:blur(7px);
}
@keyframes product-sway{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-3px) rotate(.5deg)}}
@keyframes contact-breathe{0%,100%{transform:translateX(-50%) scaleX(1);opacity:.9}50%{transform:translateX(-50%) scaleX(1.06);opacity:.7}}
@media(max-width:900px){
  #experience[data-layout='01']{
    display:flex;flex-direction:column;align-items:center;
    height:auto;min-height:calc(100svh - 112px);max-height:none;padding:28px 7% 32px;
    background:
      radial-gradient(ellipse 100% 65% at 50% 65%,#ffffff8c 0%,transparent 80%),
      linear-gradient(180deg,#f8faff66,#f8f7ff99),
      url('assets/lavender-clouds.webp') 35% center/auto 100% no-repeat,#edf1fc;
  }
  [data-layout='01'] .brand{position:static;justify-content:center;width:100%;margin:0 0 22px}
  [data-layout='01'] .brand img{width:145px}
  [data-layout='01'] .product-art{
    --bottle-height:clamp(240px,34svh,320px);
    position:relative;top:auto;right:auto;bottom:auto;transform:none;
    flex:none;margin:0 auto 36px;
  }
  [data-layout='01'] .copy{position:relative;top:auto;left:auto;width:100%;max-width:530px;text-align:center}
  [data-layout='01'] .copy h1{font-size:clamp(34px,10.3vw,64px)}
  [data-layout='01'] .teaser{margin-top:19px}
  [data-layout='01'] .capture{margin:20px auto 0;text-align:left;min-height:92px}
  [data-layout='01'] .confirmation{width:100%;text-align:center}
  [data-layout='01'] .scene-footer{position:static;width:100%;justify-content:center;margin-top:12px}
}

/* Keep the text and product together in a centered, 1400px desktop composition. */
@media(min-width:901px){
  #experience[data-layout='01']{--content-edge:max(9.3%,calc((100% - 1400px) / 2))}
  [data-layout='01'] .copy{left:var(--content-edge)}
  [data-layout='01'] .product-art{right:max(11%,calc((100% - 1400px) / 2))}
  [data-layout='01'] .brand,
  [data-layout='01'] .scene-footer{left:var(--content-edge);right:var(--content-edge)}
}


#experience[data-layout='01']{height:100svh;min-height:620px;max-height:none}.consent{font-size:11px;line-height:1.5;opacity:.65;margin:3px 24px 0}.honey{position:absolute;left:-9999px} [data-state=success] .consent{visibility:hidden}@media(max-width:900px){#experience[data-layout='01']{height:auto;min-height:100svh}.consent{text-align:center;margin-inline:10px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.type-caret{display:none}}
