/* Daydream contact + wholesale pages and the Contact Form 7 skin — layered on dd.css */

/* current page in the nav: the Figma marks it with a tinted pill (Contact) */
.dd-nav .dd-btn--ghost.is-active{background:rgba(255,255,255,.15)}
.dd-nav .dd-btn--ghost.is-active:hover{background:transparent}

/* ---------------- CONTACT HERO ---------------- */
.dc-hero{position:relative;height:calc(760*var(--u));min-height:560px;overflow:clip;background:var(--night);color:#fff;isolation:isolate}
.dc-hero .dd-stage{height:calc(760*var(--u))}
.dc-copy{position:absolute;left:var(--gx);top:calc(250*var(--u));z-index:3;display:flex;flex-direction:column;align-items:flex-start}
.dc-copy .dd-eyebrow{color:rgba(255,255,255,.6);animation:dd-fadeup 1s var(--ease) .1s both}
.dc-title{margin:calc(24*var(--u)) 0 0 -.05em;font:900 max(64px,calc(160*var(--u)))/1.1 var(--fd);letter-spacing:-.06em;white-space:nowrap}
.dc-title .dd-wi{animation:dd-rise 1.1s var(--ease) both;animation-delay:calc(.15s + var(--i)*.1s)}
.dc-lede{margin-top:calc(40*var(--u));width:560px;max-width:100%;font-size:max(17px,calc(20*var(--u)));line-height:1.6;color:rgba(255,255,255,.8);animation:dd-fadeup 1s var(--ease) .6s both}
.dc-c{translate:-50% -50%}
.dc-pack{z-index:2;transform:translate3d(calc(var(--mx,0)*var(--d)*1px),calc(var(--my,0)*var(--d)*1px),0);will-change:transform}
.dc-pack__in{width:100%;height:100%;animation:dc-in 1.5s var(--spring) both;animation-delay:var(--dl,.2s)}
.dc-pack img{width:100%;height:100%;object-fit:cover;rotate:var(--r);filter:drop-shadow(0 calc(30*var(--u)) calc(30*var(--u)) rgba(0,0,0,.35));transition:rotate 1s var(--spring)}
.dc-hero:hover .dc-pack img{rotate:calc(var(--r)*.4)}
@keyframes dc-in{from{opacity:0;transform:translateY(calc(160*var(--u))) rotate(calc(var(--r)*-2)) scale(.6)}40%{opacity:1}to{opacity:1;transform:none}}

/* ---------------- CONTACT BODY ---------------- */
.dc-body{display:grid;grid-template-columns:1fr 540px;gap:max(48px,calc(96*var(--u)));padding:max(96px,calc(160*var(--u))) var(--gx) max(96px,calc(180*var(--u)));background:#fff}
.dc-form{display:flex;flex-direction:column;gap:28px;min-width:0}
.dc-form h2{font:900 max(36px,calc(56*var(--u)))/normal var(--fd);letter-spacing:-.02em;color:var(--ink)}
.dc-side{display:flex;flex-direction:column;gap:24px;min-width:0}
.dc-ways{border-top:1px solid rgba(14,14,16,.12)}
.dc-way{display:flex;flex-direction:column;gap:6px;padding:22px 0;border-bottom:1px solid rgba(14,14,16,.12)}
.dc-way span{font-size:14px;color:var(--muted)}
.dc-way b,.dc-way a{font:700 max(18px,calc(22*var(--u)))/normal var(--fd);letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere}
.dc-way a{width:max-content;max-width:100%;background:linear-gradient(90deg,var(--pink),var(--cyan)) 0 100%/0 2px no-repeat;transition:background-size .5s var(--ease)}
.dc-way a:hover{background-size:100% 2px}
.dd .dc-card{position:relative;display:block;height:340px;border-radius:32px;overflow:hidden;color:#fff;isolation:isolate;
  background:radial-gradient(60% 50% at 90% 95%,rgba(61,203,255,.6),transparent),radial-gradient(55% 40% at 30% 20%,rgba(255,255,255,.3),transparent),linear-gradient(147.8deg,#ff5a6a,#5b3fd9);
  transition:translate .6s var(--ease),box-shadow .6s var(--ease),opacity 1s var(--ease),transform 1.1s var(--ease)}
.dc-card:hover{translate:0 -6px;box-shadow:0 40px 80px -30px #5b3fd9}
.dc-card__cloud{position:absolute;left:450px;top:90px;width:150px;height:118px;translate:-50% -50%;animation:dd-cloudfloat 4.5s ease-in-out infinite alternate}
.dc-card__cloud img{width:100%;height:100%;object-fit:contain;rotate:10deg;transition:rotate .6s var(--spring),scale .6s var(--spring)}
.dc-card:hover .dc-card__cloud img{rotate:-8deg;scale:1.12}
.dc-card .dd-eyebrow{position:absolute;left:32px;top:36px;color:rgba(255,255,255,.8)}
.dc-card h3{position:absolute;left:32px;top:150px;font:900 36px/1.05 var(--fd);letter-spacing:-.02em}
.dc-card .dd-btn{position:absolute;left:32px;top:260px;padding:14px 22px;font-size:15px}

/* ---------------- WHOLESALE ---------------- */
.dw-why{background:#fff;padding:max(96px,calc(180*var(--u))) var(--gx) max(80px,calc(160*var(--u)));display:flex;flex-direction:column;gap:max(48px,calc(80*var(--u)))}
.dw-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}
.dw-head > div{display:flex;flex-direction:column;gap:28px;flex:none}
.dw-head .dd-h2{white-space:nowrap}
.dw-head .dd-lede{width:420px;max-width:100%}
.dw-stats{display:grid;grid-template-columns:repeat(4,1fr)}
.dw-stat{display:flex;flex-direction:column;gap:16px;padding:36px 24px 0 36px;border-top:1px solid rgba(14,14,16,.12);border-left:1px solid rgba(14,14,16,.12);min-width:0}
.dw-stat:first-child{padding-left:0;border-left:0}
.dw-stat img{width:14px;height:14px}
.dd-js .dw-stats .dw-stat.is-in img{animation:dd-ping .8s var(--spring) both;animation-delay:calc(var(--i)*.1s + .3s)}
.dw-stat b{font:900 max(44px,calc(64*var(--u)))/normal var(--fd);letter-spacing:-.03em;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.dw-stat span{font-size:17px;line-height:1.5;color:var(--body)}

.dw-sheet{background:#fff;padding:0 var(--gx) max(96px,calc(180*var(--u)));display:flex;flex-direction:column;gap:56px}
.dw-sheet .dw-head h2{font:900 max(34px,calc(56*var(--u)))/normal var(--fd);letter-spacing:-.02em;color:var(--ink)}
.dw-outline{display:inline-flex;gap:10px;align-items:center;padding:14px 22px;border-radius:999px;border:1.5px solid var(--ink);font:700 15px/normal var(--fb);color:var(--ink);white-space:nowrap;flex:none;transition:background .3s,color .3s}
.dw-outline:hover{background:var(--ink);color:#fff}
.dw-outline span{display:inline-block;transition:transform .4s var(--spring)}
.dw-outline:hover span{transform:translateY(3px)}
.dw-table{width:100%;border-collapse:collapse;table-layout:fixed}
.dw-table th{padding:14px 0;border-bottom:1px solid rgba(14,14,16,.4);font:400 13px/normal var(--fb);color:var(--muted);text-align:left}
.dw-table td{padding:18px 0;border-bottom:1px solid rgba(14,14,16,.12);font-size:16px;color:var(--body);vertical-align:middle}
.dw-table col.c1{width:150px}.dw-table col.c2{width:24.3%}.dw-table col.c3{width:17.4%}.dw-table col.c4,.dw-table col.c5{width:15%}
.dw-table td b{font:700 22px/normal var(--fd);letter-spacing:-.01em;color:var(--ink)}
.dw-table td b a{background:linear-gradient(90deg,var(--g1),var(--g2)) 0 100%/0 2px no-repeat;transition:background-size .5s var(--ease)}
.dw-table tr:hover td b a{background-size:100% 2px}
.dw-thumb{position:relative;display:block;width:96px;height:96px;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,var(--g1),var(--g2))}
.dw-thumb img{position:absolute;left:-30.26px;top:-30.26px;width:156.522px;height:156.522px;max-width:none;object-fit:cover;transition:transform .6s var(--spring)}
.dw-table tr:hover .dw-thumb img{transform:rotate(-8deg) scale(1.08)}
.dd-js .dw-table tbody tr{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i)*.08s)}
.dd-js .dw-table.is-in tbody tr{opacity:1;transform:none}
.dd-js .dw-table.dd-rv{opacity:1;transform:none}

.dw-how{position:relative;isolation:isolate;overflow:clip;background:var(--night);color:#fff;padding:max(96px,calc(180*var(--u))) var(--gx);display:flex;flex-direction:column;gap:max(48px,calc(80*var(--u)))}
.dw-how__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.07}
.dw-how .dd-eyebrow{color:var(--lav)}
.dw-how__title{display:flex;flex-direction:column;gap:28px}
.dw-how .dd-h2{color:#fff}
.dw-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.dd .dw-step{display:flex;flex-direction:column;gap:20px;padding:36px 36px 40px;border-radius:32px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:translate .6s var(--ease),border-color .4s,background .4s,opacity 1s var(--ease) calc(var(--i,0)*.1s),transform 1.1s var(--ease) calc(var(--i,0)*.1s)}
.dw-step:hover{translate:0 -8px;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.08)}
.dw-step i{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;font:900 22px/1 var(--fd);font-style:normal;background:linear-gradient(135deg,var(--g1),var(--g2));transition:transform .6s var(--spring)}
.dw-step:hover i{transform:rotate(-12deg) scale(1.08)}
.dw-step h3{font:900 max(24px,calc(30*var(--u)))/normal var(--fd);letter-spacing:-.02em}
.dw-step p{font-size:17px;line-height:1.6;color:var(--mist)}

.dw-inq{background:#fff;padding:max(96px,calc(180*var(--u))) var(--gx);display:grid;grid-template-columns:460px 1fr;gap:max(48px,calc(96*var(--u)));align-items:start}
.dw-inq__intro{display:flex;flex-direction:column;gap:28px}
.dw-inq__intro h2{font:900 max(40px,calc(56*var(--u)))/1 var(--fd);letter-spacing:-.02em;color:var(--ink)}
.dw-inq__intro > p:not(.dd-eyebrow){font-size:18px;line-height:1.6;color:var(--body);max-width:440px}
.dw-inq__mail{display:flex;flex-direction:column;gap:6px;padding-top:24px;border-top:1px solid rgba(14,14,16,.12)}
.dw-inq__mail span{font-size:14px;color:var(--muted)}
.dw-inq__mail a{font:700 18px/normal var(--fd);letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere}
.dw-inq__card{background:#f6f5f2;border-radius:36px;padding:max(28px,calc(48*var(--u)));min-width:0}

/* footer without the CTA block (wholesale page) */
.dd-foot--slim{gap:72px}

/* ---------------- CONTACT FORM 7 SKIN ---------------- */
.ddf .wpcf7-form{display:flex;flex-direction:column;gap:28px;margin:0}
.ddf--card .wpcf7-form{gap:24px}
/* CF7 auto-formats the template with <p> and <br>; let the wrappers vanish so the grid/flex layout sees the fields */
.ddf .wpcf7-form p:not(.ddf-note){display:contents}
.ddf br{display:none}
.ddf-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ddf-field{display:flex;flex-direction:column;gap:10px;min-width:0;margin:0}
.ddf-label{font:500 14px/normal var(--fb);color:var(--body)}
.ddf .wpcf7-form-control-wrap{display:block;position:relative}
.ddf input[type=text],.ddf input[type=email],.ddf input[type=tel],.ddf select,.ddf textarea{
  display:block;width:100%;height:64px;padding:0 22px;border-radius:16px;border:1px solid rgba(14,14,16,.1);background:#f6f5f2;
  font:400 16px/normal var(--fb);color:var(--ink);transition:border-color .3s,box-shadow .3s,background .3s;-webkit-appearance:none;appearance:none}
.ddf--card input[type=text],.ddf--card input[type=email],.ddf--card input[type=tel],.ddf--card select,.ddf--card textarea{background:#fff}
.ddf textarea{height:200px;padding:20px 22px;resize:vertical;line-height:1.5}
.ddf--card textarea{height:150px}
.ddf ::placeholder{color:#9a9a9a;opacity:1}
.ddf input:hover,.ddf select:hover,.ddf textarea:hover{border-color:rgba(14,14,16,.3)}
.ddf input:focus,.ddf select:focus,.ddf textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(123,77,255,.15)}
.ddf select{padding-right:48px;cursor:pointer;color:var(--ink);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%230e0e10' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;background-position:right 22px center}
.ddf select:invalid,.ddf select.is-placeholder{color:#9a9a9a}

/* radio + checkbox groups rendered as chips */
.ddf .wpcf7-radio,.ddf .wpcf7-checkbox{display:flex;flex-wrap:wrap;gap:10px}
.ddf .wpcf7-list-item{margin:0}
.ddf .wpcf7-list-item label{position:relative;display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid rgba(14,14,16,.2);background:transparent;
  font:500 14px/normal var(--fb);color:var(--ink);cursor:pointer;user-select:none;transition:background .3s,color .3s,border-color .3s,transform .4s var(--spring)}
.ddf--card .wpcf7-list-item label{background:#fff;border-color:rgba(14,14,16,.15)}
.ddf .wpcf7-list-item label:hover{border-color:var(--ink)}
.ddf .wpcf7-list-item label:active{transform:scale(.96)}
.ddf .wpcf7-list-item input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.ddf .wpcf7-radio label:has(input:checked){background:var(--ink);border-color:var(--ink);color:#fff}
.ddf .wpcf7-list-item label:has(input:focus-visible){outline:2px solid var(--cyan);outline-offset:3px}
.ddf .wpcf7-checkbox label{padding-left:16px}
.ddf .wpcf7-checkbox label::before{content:"";width:10px;height:10px;flex:none;background:var(--dot) center/contain no-repeat}
.ddf .wpcf7-checkbox .wpcf7-list-item:nth-child(1){--dot:url(/wp-content/uploads/dd/svg/dot-pink.svg)}
.ddf .wpcf7-checkbox .wpcf7-list-item:nth-child(2){--dot:url(/wp-content/uploads/dd/svg/dot-lime.svg)}
.ddf .wpcf7-checkbox .wpcf7-list-item:nth-child(3){--dot:url(/wp-content/uploads/dd/svg/dot-cyan.svg)}
.ddf .wpcf7-checkbox label:has(input:checked){border:1.5px solid var(--ink);padding:10.5px 17.5px 10.5px 15.5px}
.ddf .wpcf7-checkbox label:has(input:checked) .wpcf7-list-item-label::before{content:"✓ "}

/* 21+ acceptance as a custom checkbox */
.ddf .wpcf7-acceptance .wpcf7-list-item label{padding:0;border:0;border-radius:0;background:none;gap:12px;font:400 15px/normal var(--fb);color:var(--body)}
.ddf .wpcf7-acceptance .wpcf7-list-item label::before{content:"";width:22px;height:22px;flex:none;border-radius:6px;border:1.5px solid rgba(14,14,16,.35);background:#fff center/14px no-repeat;transition:background-color .25s,border-color .25s}
.ddf .wpcf7-acceptance label:has(input:checked)::before{background-color:var(--ink);border-color:var(--ink);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'><path d='M3 7.5l2.6 2.6L11 4.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>")}

/* submit */
.ddf-submit{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ddf .wpcf7-submit{display:inline-flex;align-items:center;padding:19px 30px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:700 17px/normal var(--fb);cursor:pointer;
  background-image:linear-gradient(90deg,var(--pink),var(--purple));background-size:0 100%;background-repeat:no-repeat;transition:background-size .5s var(--ease),transform .4s var(--spring)}
.ddf .wpcf7-submit:hover,.ddf .wpcf7-submit:focus-visible{background-size:100% 100%}
.ddf .wpcf7-submit:active{transform:scale(.97)}
.ddf .wpcf7-submit:disabled{opacity:.5;cursor:default}
.ddf .wpcf7-spinner{margin:0;background:var(--ink)}
.ddf-note{margin:0;font-size:13px;color:var(--muted)}

/* validation + response */
.ddf .wpcf7-not-valid{border-color:#e5484d!important}
.ddf .wpcf7-not-valid-tip{margin-top:8px;font:500 13px/normal var(--fb);color:#e5484d}
.ddf .wpcf7 form .wpcf7-response-output,.ddf .wpcf7-response-output{margin:0;padding:16px 20px;border-radius:16px;border:0;font:500 15px/1.5 var(--fb)}
.ddf .wpcf7 form.invalid .wpcf7-response-output,.ddf .wpcf7 form.unaccepted .wpcf7-response-output,.ddf .wpcf7 form.payment-required .wpcf7-response-output{background:#fff1ea;color:#a3361b}
.ddf .wpcf7 form.sent .wpcf7-response-output{background:#eefbe8;color:#1d6b2f}
.ddf .wpcf7 form.failed .wpcf7-response-output,.ddf .wpcf7 form.aborted .wpcf7-response-output,.ddf .wpcf7 form.spam .wpcf7-response-output{background:#fdecec;color:#9b1c1c}
.ddf .wpcf7 form.sent .wpcf7-response-output{animation:dd-fadeup .6s var(--ease) both}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1180px){
  .dc-body{grid-template-columns:1fr 440px}
  .dc-card__cloud{left:auto;right:-10px;translate:0 -50%}
  .dw-inq{grid-template-columns:1fr}
}
@media (max-width:900px){
  .dc-hero{height:auto;min-height:0;display:flex;flex-direction:column;padding:calc(110px + var(--wp-admin--admin-bar--height,0px)) 0 24px}
  .dc-copy{position:relative;left:auto;top:auto;padding-inline:var(--gx)}
  .dc-title{font-size:clamp(56px,17vw,140px);margin-top:12px}
  .dc-lede{margin-top:16px}
  /* visual centre of the contact stage is x≈1300 of 1728 */
  .dc-hero .dd-stage{--u:calc(100vw/900);position:relative;margin:calc(-20*var(--u)) 0 calc(-60*var(--u));transform:translateX(calc(-50% - 436*var(--u)));height:calc(720*var(--u));flex:none}
  .dc-body{grid-template-columns:1fr}
  .dc-card{height:300px}
  .dc-card h3{top:120px;font-size:30px}
  .dc-card .dd-btn{top:220px}
  .dw-head{flex-direction:column;align-items:flex-start}
  .dw-head > div{flex:initial}
  .dw-head .dd-h2{white-space:normal}
  .dw-stats{grid-template-columns:1fr 1fr}
  .dw-stat{padding:28px 12px 28px 20px}
  .dw-stat:nth-child(3){padding-left:0;border-left:0}
  .dw-steps{grid-template-columns:1fr}
  .dw-table thead{display:none}
  .dw-table,.dw-table tbody,.dw-table tr{display:block;width:100%}
  .dw-table tr{display:grid;grid-template-columns:96px 1fr;column-gap:18px;row-gap:4px;padding:18px 0;border-bottom:1px solid rgba(14,14,16,.12)}
  .dw-table td{display:block;padding:0;border:0;font-size:15px}
  .dw-table td:first-child{grid-row:1/span 5}
  .dw-table td[data-l]::before{content:attr(data-l) ": ";color:var(--muted)}
  .dw-table td b{font-size:19px}
  .ddf-row{grid-template-columns:1fr}
}
@media (max-width:560px){
  .dc-card h3{font-size:26px}
  .dc-way b,.dc-way a{font-size:clamp(14px,4.3vw,18px);overflow-wrap:normal}
  .dw-inq__mail a{font-size:clamp(14px,4.3vw,18px);overflow-wrap:normal}
  .dw-stat b{font-size:clamp(34px,11vw,48px)}
}

@media (prefers-reduced-motion:reduce){
  .dd-js .dw-table tbody tr{opacity:1;transform:none}
  .dc-pack{transform:none!important}
}
