/* Line 30714 (studio_home_v2): the one Studio home. Phone first (375 px), the Google path tokens (ns-tokens.css), light and
   dark from the tokens; the hero host placement is the workspace's own (studio-workspace.css .studio-hero-host). */
[data-studio-home]{margin:0;background:var(--ns-bg,#fff);color:var(--ns-text,#202124);font:16px/1.5 var(--ns-font,Roboto,system-ui,sans-serif)}
[data-studio-home] a{color:var(--ns-gold-deep,#1967d2)}
[data-studio-home] :focus-visible{outline:3px solid var(--ns-gold,#f9ab00);outline-offset:3px}

.studio-home-header{display:flex;align-items:center;gap:12px;padding:12px 16px}
.studio-home-header .studio-home-brand{font-size:20px;font-weight:700;color:var(--ns-text,#202124);text-decoration:none}
.studio-home-where{font-size:15px;color:var(--ns-text-2,#5f6368)}
.studio-home-top{display:flex;align-items:center;gap:16px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.studio-home-top a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--ns-text,#202124)}
.studio-home-agent{display:flex;align-items:center;gap:8px}
.studio-home-agent label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.studio-home-agent select,.studio-home-agent button{min-height:44px;border:1px solid var(--ns-border,#dadce0);border-radius:8px;padding:0 10px;background:var(--ns-surface,#f1f3f4);color:inherit;max-width:44vw}

.studio-home{padding:16px 16px 32px}
.studio-home-kicker{margin:0 0 4px;font-size:14px;font-weight:500;letter-spacing:.02em;color:var(--ns-text-2,#5f6368)}
.studio-home-hero .studio-title h1{font-size:28px;line-height:1.2;font-weight:500;margin:0 0 12px;overflow-wrap:anywhere}
.studio-home-hero .studio-title>p{margin:0 0 20px;color:var(--ns-text-2,#5f6368)}
.studio-home-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:0 0 20px}
.studio-home-cta{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:24px;background:var(--ns-gold,#f9ab00);color:var(--ns-on-accent,#202124)!important;font-weight:500;text-decoration:none;text-align:center}
.studio-home-cta[aria-disabled=true]{background:var(--ns-surface,#f1f3f4);color:var(--ns-text-2,#5f6368)!important}
.studio-home-plans{display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.studio-home-spine{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.studio-home-spine a{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:4px 12px 4px 4px;border:1px solid var(--ns-border,#dadce0);border-radius:20px;color:var(--ns-text,#202124);text-decoration:none;font-size:14px}
.studio-home-n{display:inline-grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--ns-surface,#f1f3f4);color:var(--ns-text,#202124);font-size:14px;font-weight:500}

.studio-home-steps{display:grid;gap:16px;margin:24px 0 0;align-items:start}
.studio-home-step{min-width:0;padding:20px;border:1px solid var(--ns-border,#dadce0);border-radius:var(--ns-radius,12px);background:var(--ns-card,#fff)}
.studio-home-step-head{display:flex;gap:12px;align-items:flex-start}
.studio-home-step-head .studio-home-n{background:var(--ns-gold,#f9ab00);color:var(--ns-on-accent,#202124)}
.studio-home-step h2{font-size:20px;font-weight:500;line-height:1.3;margin:0 0 4px}
.studio-home-step-head p{margin:0 0 16px;color:var(--ns-text-2,#5f6368)}
.studio-home-go{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border:1px solid var(--ns-gold-deep,#1967d2);border-radius:22px;font-weight:500;text-decoration:none;max-width:100%;overflow-wrap:anywhere}
.studio-home-later{margin:0;color:var(--ns-text-2,#5f6368);font-size:14px}

.studio-home-looks{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0 0 16px;padding:0}
.studio-home-looks li{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px 4px 4px;border-radius:18px;background:var(--ns-surface,#f1f3f4);font-size:14px}
.studio-home-look-n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ns-bg,#fff);font-size:12px;font-weight:500}
.studio-home-looks small{color:var(--ns-text-2,#5f6368);font-size:12px}
.studio-home-look-paid{border:1px dashed var(--ns-border-strong,#bdc1c6)}

.studio-home-shelves{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin:16px 0 0}
.studio-home-shelf{display:flex;flex-direction:column;gap:4px;min-height:44px;padding:14px 16px;border:1px solid var(--ns-border,#dadce0);border-radius:var(--ns-radius,12px);text-decoration:none;color:var(--ns-text,#202124)!important}
.studio-home-shelf span{color:var(--ns-text-2,#5f6368);font-size:14px}

.studio-home-more-ways,.studio-home-every details{margin:16px 0 0}
.studio-home-more-ways summary,.studio-home-every summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--ns-text-2,#5f6368);font-weight:500}
.studio-home-more-ways ul,.studio-home-every ul{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:2px}
.studio-home-more-ways a,.studio-home-every a{display:inline-flex;align-items:center;min-height:40px;overflow-wrap:anywhere}
.studio-home-every{margin:24px 0 0;padding:4px 20px;border:1px solid var(--ns-border,#dadce0);border-radius:var(--ns-radius,12px)}
.studio-home-every small{margin-left:8px;color:var(--ns-text-2,#5f6368);font-size:12px}

.studio-home-price{margin:24px 0 0;padding:20px;border-radius:var(--ns-radius,12px);background:var(--ns-surface,#f1f3f4)}
.studio-home-price h2{font-size:20px;font-weight:500;margin:0 0 4px}
.studio-home-price p{margin:0 0 16px;color:var(--ns-text-2,#5f6368)}
.studio-home-price ul{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}
.studio-home-price li{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:8px;background:var(--ns-card,#fff)}
.studio-home-foot{padding:16px;color:var(--ns-text-2,#5f6368);font-size:13px;text-align:center}
.studio-home-foot p{margin:0 auto;max-width:640px}

/* On a phone the guide keeps the house dock (content-page-live-host.css): the page gives back its safe space at the end. */
@media(max-width:767px){[data-studio-home][data-studio-hero-host]{padding-bottom:var(--ns-content-host-safe-height,180px)}}
/* On a phone the five steps follow right under the hero, so their chips wait for the wider screens. */
@media(max-width:767.98px){.studio-home-spine{display:none}}
@media(max-width:359.98px){.studio-home-where{display:none}}
@media(min-width:768px){
    .studio-home-header{padding:16px 32px}
    .studio-home{padding:24px 32px 48px;max-width:1320px}
    .studio-home-hero .studio-title h1{font-size:40px}
    .studio-home-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
    .studio-home-step[data-studio-flow-step=dress]{grid-row:span 2}
    .studio-home-shelves{grid-template-columns:repeat(2,minmax(0,1fr))}
    .studio-home-price ul{grid-template-columns:repeat(3,minmax(0,1fr))}
    .studio-home-price li{flex-direction:column}
}
@media(min-width:1200px){
    .studio-home-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
}