/* The Interior House — "Let's design your home" quiz pop-up */
.planner{border:0;padding:0;width:min(940px,94vw);max-height:min(640px,92vh);background:var(--warm-cream);color:var(--espresso);box-shadow:0 30px 80px rgba(30,22,19,.45);overflow:hidden;display:none}
.planner[open]{display:grid;grid-template-columns:42% 1fr;animation:planner-pop .45s var(--ease)}
.planner::backdrop{background:rgba(30,22,19,.62);backdrop-filter:blur(3px)}
html.planner-open{overflow:hidden}
@keyframes planner-pop{from{opacity:0;transform:translateY(24px) scale(.98)}}

.planner__media{position:relative;background:var(--burnt-clay);min-height:100%}
.planner__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .35s}
.planner__media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(48,35,31,.75),transparent 55%)}
.planner__badge{position:absolute;left:1.4rem;right:1.4rem;bottom:1.3rem;z-index:1;margin:0;color:var(--warm-cream);font-size:.85rem;line-height:1.5}
.planner__badge strong{display:block;font:400 1.5rem var(--serif)}

.planner__body{display:flex;flex-direction:column;padding:1.4rem clamp(1.2rem,3vw,2.4rem) 1.2rem;overflow-y:auto;min-height:520px}
.planner__top{display:flex;align-items:center;gap:.8rem;margin-bottom:1.6rem}
.planner__back,.planner__close{flex:none;width:38px;height:38px;border-radius:50%;border:1px solid rgba(48,35,31,.2);background:transparent;cursor:pointer;font-size:1.1rem;line-height:1;display:grid;place-items:center;transition:.2s}
.planner__close{font-size:1.5rem}
.planner__back:hover,.planner__close:hover{background:var(--espresso);color:var(--warm-cream);border-color:var(--espresso)}
.planner__back[hidden]{visibility:hidden;display:grid}
.planner__progress{flex:1;height:4px;background:rgba(168,137,98,.25);border-radius:4px;overflow:hidden}
.planner__progress span{display:block;height:100%;width:0;background:var(--terracotta);border-radius:4px;transition:width .45s var(--ease)}
.planner__count{font:500 .75rem var(--sans);letter-spacing:.08em;color:var(--teak);min-width:2.6rem;text-align:right}

.planner__step{flex:1}
.planner__step.is-in{animation:planner-in .4s var(--ease)}
.planner__step.is-in.is-back{animation-name:planner-in-back}
@keyframes planner-in{from{opacity:0;transform:translateX(26px)}}
@keyframes planner-in-back{from{opacity:0;transform:translateX(-26px)}}
.planner__hello{font:400 clamp(1.7rem,3vw,2.2rem)/1.15 var(--serif);color:var(--burnt-clay);margin:0 0 .5rem}
.planner__cheer{display:inline-block;font-size:.82rem;font-weight:400;color:var(--burnt-clay);background:rgba(168,93,69,.1);padding:.35rem .8rem;border-radius:999px;margin:0 0 .9rem}
.planner__q{font:400 clamp(1.35rem,2.4vw,1.75rem)/1.25 var(--serif);margin:0 0 .4rem}
.planner__hint{font-size:.88rem;color:var(--text-soft);margin:0 0 .4rem}

.planner__cards{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1.2rem}
.planner__card{position:relative;display:block;padding:0;border:2px solid transparent;background:var(--sand);cursor:pointer;overflow:hidden;aspect-ratio:16/10;text-align:left;transition:border-color .2s,transform .2s}
.planner__card img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.planner__card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(48,35,31,.78),transparent 60%)}
.planner__card span{position:absolute;left:.9rem;right:.9rem;bottom:.7rem;z-index:1;color:var(--warm-cream);font:400 1.15rem var(--serif);display:flex;justify-content:space-between;align-items:center}
.planner__card span::after{content:"→";font:300 1rem var(--sans);transition:transform .2s}
.planner__card:hover,.planner__card:focus-visible{border-color:var(--terracotta);transform:translateY(-2px)}
.planner__card:hover img{transform:scale(1.06)}
.planner__card:hover span::after{transform:translateX(3px)}
.planner__card.is-picked{border-color:var(--terracotta)}

.planner__chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.planner__chip{border:1px solid rgba(168,93,69,.55);background:var(--white);color:var(--espresso);padding:.8rem 1.1rem;font:400 .92rem var(--sans);cursor:pointer;border-radius:999px;transition:.2s}
.planner__chip:hover,.planner__chip:focus-visible{background:var(--terracotta);border-color:var(--terracotta);color:var(--warm-cream)}
.planner__chip.is-picked{background:var(--terracotta);border-color:var(--terracotta);color:var(--warm-cream)}

.planner__other{display:flex;gap:.5rem;margin-top:1rem}
.planner__other input,.planner__field input{flex:1;min-width:0;font:300 1rem var(--sans);color:var(--espresso);background:var(--white);border:1px solid rgba(48,35,31,.22);padding:.8rem .9rem;border-radius:var(--radius)}
.planner__other input:focus,.planner__field input:focus{outline:none;border-color:var(--terracotta);box-shadow:0 0 0 3px rgba(168,93,69,.15)}
.planner__next{border:0;background:var(--espresso);color:var(--warm-cream);padding:0 1.3rem;font:500 .88rem var(--sans);cursor:pointer}
.planner__next:hover{background:var(--burnt-clay)}

.planner__form{display:grid;gap:.9rem;margin-top:1.1rem}
.planner__field{display:grid;gap:.35rem;font-size:.82rem;font-weight:400}
.planner__field input{width:100%}
.planner__tel{display:flex}
.planner__tel>span{display:grid;place-items:center;padding:0 .8rem;background:var(--sand);border:1px solid rgba(48,35,31,.22);border-right:0;font-size:.95rem}
.planner__error{margin:0;min-height:1.2em;font-size:.85rem;color:#a3341f}
.planner__error a{color:inherit}
.planner__submit{display:inline-flex;justify-content:center;align-items:center;border:0;background:var(--terracotta);color:var(--warm-cream);padding:1rem 1.4rem;font:500 .95rem var(--sans);letter-spacing:.02em;cursor:pointer;text-decoration:none;transition:background .2s}
.planner__submit:hover{background:var(--burnt-clay);color:var(--warm-cream)}
.planner__submit:disabled{opacity:.7;cursor:wait}
.planner__legal{font-size:.75rem;color:var(--text-soft);margin:0}
.planner__legal a{color:var(--burnt-clay)}

.planner__done{text-align:center;padding-top:.5rem}
.planner__tick{width:64px;height:64px;margin:0 auto 1rem;border-radius:50%;background:#1f7a4d;color:#fff;display:grid;place-items:center;font-size:1.8rem;animation:planner-pop .5s var(--ease)}
.planner__summary{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin:1.2rem 0 1.6rem}
.planner__summary li{background:var(--sand);padding:.35rem .8rem;border-radius:999px;font-size:.8rem}
.planner__done-actions{display:flex;flex-direction:column;align-items:center;gap:.6rem}
.planner__link{background:none;border:0;color:var(--burnt-clay);text-decoration:underline;cursor:pointer;font-size:.88rem}
.planner__trust{margin:1.2rem 0 0;font-size:.74rem;color:var(--teak);letter-spacing:.03em;text-align:center}

@media (max-width:760px){
  .planner{width:100vw;max-width:100vw;max-height:92vh;margin:auto 0 0;border-radius:16px 16px 0 0}
  .planner[open]{grid-template-columns:1fr;animation-name:planner-sheet}
  .planner__media{display:none}
  .planner__body{min-height:0;padding:1.1rem 1.1rem 1rem}
  .planner__top{margin-bottom:1.1rem}
  .planner__cards{gap:.6rem}
  .planner__card span{font-size:1rem;left:.7rem;bottom:.55rem}
  .planner__chip{padding:.7rem .95rem;font-size:.88rem}
}
@media (max-height:720px) and (min-width:761px){
  .planner__body{min-height:0;padding-top:1rem}
  .planner__top{margin-bottom:1rem}
  .planner__hello{font-size:1.6rem}
  .planner__card{aspect-ratio:16/8}
  .planner__cards,.planner__chips{margin-top:.9rem}
}
@keyframes planner-sheet{from{transform:translateY(100%)}}
@media (prefers-reduced-motion:reduce){
  .planner[open],.planner__step.is-in,.planner__tick{animation:none}
}