/* Shared readable typography for current and future SUNNY Furniture pages. */
:root{--font-ui:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;--text-body:1.0625rem;--text-ui:1rem;--text-small:.875rem}
html{font-size:100%;scroll-padding-top:170px}
body{font-family:var(--font-ui);font-size:var(--text-body);line-height:1.65}
h1,h2,h3{font-family:var(--font-ui);font-weight:600;letter-spacing:-.025em;overflow-wrap:break-word}
h1{line-height:1.12}h2{line-height:1.2}h3{line-height:1.3}
button,input,select,textarea{font-family:var(--font-ui)}
header nav a{font-size:1.125rem;font-weight:700;display:inline-flex;align-items:center;min-height:44px;line-height:1.4}
header nav{gap:clamp(16px,1.7vw,28px);margin-right:12px}
.lang select{font-size:var(--text-ui);min-height:44px;max-width:130px}
.brand span{font-family:var(--font-ui);font-size:1.0625rem;letter-spacing:2px}
.eyebrow,.immersive .eyebrow{font-size:var(--text-small);letter-spacing:.1em;line-height:1.6}
.hero-copy>p,.immersive .hero-copy>p,.about>div>p{font-family:var(--font-ui);font-size:1.25rem;line-height:1.6}
.immersive h1{font-size:clamp(56px,6.1vw,100px);line-height:1.08;letter-spacing:-.035em}
.button,.immersive .button,.hero .button,.inquiry-actions .button,.email-options .button{font-size:var(--text-ui);line-height:1.45;min-height:48px;font-weight:500;padding:13px 21px;gap:16px;text-align:start}
.filter{font-size:var(--text-ui);min-height:44px;padding:9px 17px;line-height:1.4}
.section-heading>p,.hospitality-copy>p,.space p,.values p,.contact-intro>p,.contact-aside p,.publication>p,.dialog-copy>p{font-size:var(--text-body);line-height:1.65}
.space h3,.values h3{font-size:1.375rem;font-weight:600}
.space small{font-size:var(--text-small)}
.fineprint,.hero-note,.immersive .hero-note,.photo-label,.publication-empty,.copyright,footer p,.email-help,.email-status{font-size:var(--text-small);line-height:1.65;letter-spacing:normal}
.immersive .hero-note{font-size:1.125rem;line-height:1.4;letter-spacing:.06em}
.text-link,.inquiry-actions .text-link,.footer-links,.footer-links button,.footer-contacts,.quick-contact a{font-size:var(--text-ui);line-height:1.55}
.footer-links a,.footer-contacts a{display:inline-flex;align-items:center;min-height:44px}
.product-card h3{font-size:1.25rem;font-weight:600;line-height:1.4;min-height:78px;padding-block:16px;gap:10px}
.product-card h3 span:last-child{font-family:var(--font-ui);font-size:1.125rem}
form label,legend,.email-dialog label{font-size:var(--text-ui);line-height:1.5}
input,textarea,form select{font-size:var(--text-ui);line-height:1.5;min-height:48px}
.checks label{font-size:var(--text-ui);padding:10px 12px;min-height:44px;gap:8px}
.checks input{width:18px;height:18px;min-height:0;flex-shrink:0}
#form-status{font-size:var(--text-ui)}
.contact-channel{font-size:var(--text-small)}.direct-contact strong{font-size:1.125rem;line-height:1.5}
.email-dialog h2{font-size:2rem;line-height:1.25}.close{width:44px;height:44px}
.motion-toggle,.scroll-cue,.arrival-caption,.replay-intro,#skip-intro{font-size:var(--text-small);line-height:1.45;letter-spacing:normal;min-height:44px}
.hero-bottom{display:none}.arrival-controls{gap:12px}
.breadcrumbs,.catalog-card-label,.catalog-note,.model-label,.photo-caption,#result-count,.spec-pending{font-size:var(--text-small);line-height:1.6}
.breadcrumbs a{display:inline-flex;align-items:center;min-height:44px}
.brand::before{content:"";display:inline-block;vertical-align:middle;width:46px;height:44px;margin-inline-end:10px;background:transparent url("/assets/sunny-logo.png?v=26") center/contain no-repeat;border-radius:4px;flex:none}
.brand span{margin-inline-start:56px}
header .brand::before{margin-inline-start:-1ch;margin-inline-end:calc(10px + 1ch)}
header .brand span{font-size:1.25rem;margin-top:2px}
.catalog-intro>p{font-size:var(--text-body);line-height:1.65}
.catalog-intro h1{line-height:1.15}.catalog-card-heading h2{font-size:1.625rem;font-weight:600}
.model-search{font-size:var(--text-ui)}.model-search input{font-size:var(--text-ui);min-height:48px}
.product-category{font-family:var(--font-ui);font-size:1.25rem;line-height:1.55}
.product-contact{font-size:var(--text-ui);line-height:1.6}.product-contact a{min-height:44px;display:flex;align-items:center;flex-wrap:wrap;gap:5px;overflow-wrap:anywhere}
.product-spec-grid h2{font-size:1.75rem;line-height:1.3}
.spec-table,.spec-table thead th,.material-list{font-size:var(--text-ui);line-height:1.6}
.spec-table th,.spec-table td{padding:15px 13px}.spec-table thead th,.spec-table tbody th{font-weight:500}
.material-list>div{grid-template-columns:minmax(110px,35%) minmax(0,1fr);gap:16px;padding-block:16px}
.gallery-thumbs button{width:calc((100% - 20px)/3);max-width:160px;min-width:0;padding:6px;gap:8px}
.gallery-thumbs button span{font-size:var(--text-small);line-height:1.45;overflow-wrap:break-word}
html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3{letter-spacing:0;line-height:1.35}
@media(max-width:1250px){header,header.scrolled{height:auto;min-height:132px;flex-wrap:wrap;padding-block:12px;gap:8px 16px}header nav{order:3;width:100%;margin:0;gap:26px;overflow-x:auto;white-space:nowrap;justify-content:flex-start;padding-block:0 3px}header .lang{margin-inline-start:auto}header nav a{flex-shrink:0}.catalog-main{padding-top:185px}.immersive .hero-copy{padding-top:190px}}
@media(max-width:750px){
.brand::before{width:42px;height:40px;margin-inline-end:8px;background-size:contain}
.brand span{margin-inline-start:50px}
header .brand::before{margin-inline-end:calc(8px + 1ch)}
header .brand span{font-size:1.125rem}
 header,header.scrolled{min-height:124px;padding:12px 5%;gap:8px 12px}.brand{font-size:28px}.brand span{font-size:1rem;letter-spacing:1.8px}.lang{padding-inline-start:12px}.lang select{max-width:112px}header nav{gap:24px}
 .immersive{min-height:900px;height:auto;max-height:none}.immersive .hero-copy{min-height:900px;padding:185px 6% 240px;max-width:none}.immersive .eyebrow{margin-top:0;font-size:var(--text-small);letter-spacing:.06em}.immersive h1{font-size:clamp(42px,10.8vw,64px);line-height:1.12;letter-spacing:-.03em;max-width:600px}.immersive .hero-copy>p{font-size:1.125rem;line-height:1.6;max-width:390px}.immersive .actions{gap:12px;max-width:100%;flex-direction:row;align-items:stretch}.immersive .button{white-space:normal;max-width:100%;padding:13px 18px}.immersive .hero-note{bottom:160px;max-width:88%;font-size:var(--text-small);line-height:1.6;letter-spacing:normal}.hero-bottom{bottom:24px;align-items:center;justify-content:flex-start;gap:8px 16px}.hero-bottom .motion-toggle{max-width:100%}.hero-bottom .replay-intro{margin:0}.scroll-cue{margin-inline-start:auto}.arrival-controls{bottom:110px;flex-wrap:wrap}.arrival-caption{max-width:55%}.arrival-track{max-width:55px}
 h2{font-size:clamp(30px,7vw,40px);line-height:1.25}.section-heading>p{max-width:40ch}.about>div>p{font-size:1.125rem}.values{gap:22px}.product-grid{gap:22px 16px}.product-card h3{font-size:1.125rem;min-height:82px}.filters{gap:9px}.form-row{grid-template-columns:1fr;gap:0}.checks{gap:10px}.inquiry-actions{align-items:stretch}.inquiry-actions .button{font-size:var(--text-ui);padding:13px 18px}.email-options .button{font-size:var(--text-ui);padding:12px 17px}.email-dialog h2{font-size:1.75rem}.footer-links{gap:8px 22px}.footer-contacts{gap:4px}
 .catalog-main{padding:180px 5% 55px}.breadcrumbs{gap:8px;margin-bottom:24px}.catalog-intro h1{font-size:clamp(34px,9vw,48px);letter-spacing:-.025em}.catalog-toolbar{gap:16px;align-items:start;flex-direction:column}.model-search{width:100%}.catalog-grid{gap:28px 16px}.catalog-card-heading h2{font-size:1.5rem}.product-spec-grid h2{font-size:1.625rem}.spec-table,.spec-table thead th,.material-list{font-size:var(--text-ui)}.spec-table th,.spec-table td{padding:14px 12px}.material-list>div{grid-template-columns:1fr;gap:5px}.material-list dt{font-weight:500}.product-overview h1{font-size:3rem}.gallery-thumbs{gap:8px}.gallery-thumbs button{width:calc((100% - 16px)/3);padding:5px;max-width:none}.gallery-thumbs button span{font-size:var(--text-small)}
}
@media(max-width:380px){.brand{font-size:25px}.lang select{max-width:96px}.values{grid-template-columns:1fr}.immersive .actions{flex-direction:column;align-items:flex-start}.hero-bottom .scroll-cue{margin-inline-start:0}.product-card h3{font-size:1.0625rem}.email-options .button{width:100%}}

/* Product detail layout: compact gallery beside the complete product information. */
.catalog-page:has(.product-top) .catalog-main{max-width:1360px}
.product-top{grid-template-columns:minmax(280px,440px) minmax(0,1fr);gap:clamp(32px,4.5vw,72px);align-items:start}
.product-gallery{width:100%;max-width:440px;min-width:0}
.product-overview{min-width:0;padding-top:0}
.product-overview>.eyebrow{margin-bottom:10px}.product-overview h1{font-size:clamp(36px,3.4vw,48px);margin:5px 0 8px}.product-overview>.product-category{font-size:1.125rem;margin-bottom:22px}
.product-overview .product-spec-grid{grid-template-columns:minmax(0,1fr);gap:26px;margin:0 0 26px}
.product-overview .product-spec-grid>section{min-width:0}
.product-overview .product-spec-grid h2{font-size:1.375rem;line-height:1.35;margin-bottom:12px}
.product-overview .material-list>div{grid-template-columns:minmax(100px,30%) minmax(0,1fr);gap:16px;padding:11px 0}
.product-overview .spec-table th,.product-overview .spec-table td{padding:12px 10px}
.product-overview .quote-model{margin-top:0}
.product-overview .product-contact{margin-top:18px;padding-top:14px;gap:4px}
@media(min-width:751px){.product-gallery{position:sticky;top:170px}}
@media(min-width:1251px){.product-gallery{top:120px}}
@media(max-width:1000px) and (min-width:751px){.product-top{grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr);gap:30px}.product-overview .material-list>div{grid-template-columns:1fr;gap:4px}}
@media(max-width:750px){.product-top{grid-template-columns:minmax(0,1fr);gap:30px}.product-gallery{max-width:360px;justify-self:center}.product-overview h1{font-size:2.5rem}.product-overview .material-list>div{grid-template-columns:1fr;gap:4px}.product-overview .product-spec-grid{gap:24px}.product-overview .product-spec-grid h2{font-size:1.375rem}}
/* Three independent material color selections. */
.product-colors{margin:30px 0;border-top:1px solid var(--line);padding-top:24px}
.color-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.color-heading h2{font-size:1.375rem;line-height:1.35;margin:0}
.swatch-reset{border:0;background:transparent;color:var(--muted);text-decoration:underline;font-size:.875rem;min-height:44px;padding:6px;line-height:1.4}
.swatch-reset[hidden]{display:none}
.color-group{margin:0 0 22px;padding:0;border:0;min-width:0}
.color-group legend{font-size:1rem;font-weight:600;line-height:1.5;margin-bottom:12px}
.swatch-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px 10px}
.swatch-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;min-width:0;margin:0}
.swatch-option input{position:absolute;opacity:0;width:100%;height:100%;inset:0;margin:0;cursor:pointer;z-index:1}
.swatch-sample{display:block;width:100%;height:46px;border:1px solid #17394a26;border-radius:8px;background-color:var(--swatch-color);position:relative;box-shadow:inset 0 1px 2px #ffffff40}
.swatch-option input:checked+.swatch-sample{outline:2px solid var(--navy);outline-offset:3px}
.swatch-option input:checked+.swatch-sample:after{content:'✓';position:absolute;inset-inline-end:3px;top:3px;background:var(--navy);color:white;border:1px solid white;border-radius:50%;width:20px;height:20px;display:grid;place-items:center;font-size:13px;line-height:1}
.swatch-option input:focus-visible+.swatch-sample{outline:3px solid #538b9f;outline-offset:4px}
.swatch-name{font-size:.875rem;line-height:1.35;text-align:center;overflow-wrap:break-word;color:var(--muted);width:100%}
.swatch-option input:checked~.swatch-name{font-weight:600;color:var(--navy)}
.texture-frame{background-image:linear-gradient(120deg,#ffffff18,transparent 45%,#0000000b)}
.texture-wood{background-image:repeating-linear-gradient(4deg,transparent 0 4px,#613b292e 5px,transparent 6px 11px),repeating-linear-gradient(177deg,#e6be7926 0 7px,#5c3a251f 8px 9px,transparent 10px 17px)}
.texture-fabric{background-image:repeating-linear-gradient(0deg,#ffffff22 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#00000012 0 1px,transparent 1px 3px)}
.texture-wicker{background-image:repeating-linear-gradient(0deg,#00000038 0 1px,transparent 1px 7px,#ffffff22 7px 8px),repeating-linear-gradient(90deg,#ffffff35 0 3px,#00000028 3px 4px,transparent 4px 9px);background-size:18px 16px}
.texture-mixed{background-image:repeating-linear-gradient(0deg,#00000040 0 1px,transparent 1px 7px,#ffffff28 7px 8px),repeating-linear-gradient(90deg,#ffffff50 0 4px,#00000035 4px 8px,transparent 8px 12px,#ffffff18 12px 18px)}
.swatch-selection{font-size:.875rem;line-height:1.5;color:var(--navy);margin:10px 0 0;min-height:0}
.swatch-selection:empty{display:none}
@media(max-width:1000px) and (min-width:751px){.swatch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:750px){.swatch-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 12px}.swatch-sample{height:48px}.color-heading{align-items:start}.color-group{margin-bottom:24px}}
.product-gallery>a{position:relative}
.product-color-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:inherit;pointer-events:none}
.product-color-preview[hidden]{display:none}
.product-gallery>a.has-color-preview>#product-photo{visibility:hidden}
.color-group[hidden]{display:none}
.color-picker-preview{display:none}
@media(max-width:750px){.color-picker-preview{display:block;position:sticky;top:144px;z-index:4;width:100%;height:200px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:9px;margin-bottom:20px;box-shadow:0 5px 18px #17394a14}}

/* Nine equal collection cards: three compact rows at every viewport width. */
.collections .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1040px;gap:22px;margin-inline:auto}
.collections .product-card .image-wrap{aspect-ratio:1/1}
.collections .product-card h3{min-height:0;font-size:clamp(16px,1.5vw,22px);line-height:1.3;padding:12px 2px 15px}
@media(max-width:750px){.collections .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.collections .product-card h3{font-size:14px;line-height:1.32;min-height:58px;padding:8px 1px 4px;gap:2px}.collections .product-card h3 span:last-child{font-size:14px}}
@media(max-width:380px){.collections .product-grid{gap:9px}.collections .product-card h3{font-size:14px;min-height:70px}}

/* Single-line display headings and highlighted supporting subtitles. */
main{overflow-x:clip}
main .heading-subtitle{
 display:block;width:max-content;max-width:100%;
 padding:7px 12px;margin-top:0;margin-bottom:20px;
 background:#294b5b;color:#fff!important;border-radius:4px;
 font-family:Arial,"Noto Sans",sans-serif!important;
 font-size:clamp(13px,1.1vw,16px)!important;
 line-height:1.4!important;white-space:nowrap;
 overflow:hidden;text-overflow:ellipsis;
}
main h1,main h2{white-space:nowrap;text-wrap:nowrap;max-width:100%;scale:var(--fit-x,1) 1;transform-origin:left center}
main .hero-copy h1{white-space:normal;text-wrap:balance;max-width:none;scale:1 1}
html[dir=rtl] main :is(h1,h2){transform-origin:right center}
@media(max-width:750px){main .heading-subtitle{font-size:13px!important;padding:7px 10px;max-width:100%}}

/* Keep the hero tagline unboxed and make Contact links land directly. */
html{scroll-behavior:auto}
.immersive .hero-copy>p.heading-subtitle{
 width:auto;background:transparent;color:var(--navy)!important;
 padding:0;border-radius:0;overflow:visible;text-overflow:clip;
 font-family:var(--font-ui)!important;font-size:clamp(18px,1.6vw,22px)!important
}

/* Fill the entire collection caption bar below each homepage image. */
.collections .product-card h3{
 background:#294b5b;color:#fff;border-bottom:0;
 align-items:center;min-height:52px;padding:10px 12px;
 border-radius:0 0 4px 4px
}
.collections .product-card h3>span:first-child{
 display:inline-block;
 background:transparent;color:inherit;padding:0;border-radius:0;
 line-height:1.25
}
@media(max-width:750px){.collections .product-card h3{min-height:58px;padding:8px 7px;gap:4px}}
@media(max-width:380px){.collections .product-card h3{min-height:70px}}
