/* Scale the established desktop proportions without shrinking touch targets. */
:root {
 --sonte-unit: clamp(.75px, .078125vw, 2.5px);
 --sonte-icon: clamp(18px, 1.71875vw, 55px);
 --sonte-card-pad: calc(40 * var(--sonte-unit));
 --sonte-field-height: max(120px, calc(120 * var(--sonte-unit)));
 --sonte-field-pad: calc(10 * var(--sonte-unit));
 --sonte-field-inner: calc(var(--sonte-field-height) - 2 * var(--sonte-field-pad));
}
.site-header { column-gap: calc(24 * var(--sonte-unit)) !important; padding-top: calc(16 * var(--sonte-unit)) !important; padding-bottom: calc(16 * var(--sonte-unit)) !important; }
.site-header > a img { width: clamp(145px, 16vw, 512px) !important; }
.site-header nav { column-gap: calc(18 * var(--sonte-unit)) !important; }
.site-header nav a { font-size: clamp(15px, 1.5625vw, 50px) !important; padding-block: calc(10 * var(--sonte-unit)) !important; }
.site-header #header-socials { gap: calc(12 * var(--sonte-unit)) !important; margin-left: calc(24 * var(--sonte-unit)) !important; }
.site-header #header-socials .header-social-link, #footer-social-icons a { width: var(--sonte-icon); height: var(--sonte-icon); padding: 0 !important; }
.site-header #header-socials svg, #footer-social-icons svg { width: var(--sonte-icon) !important; height: var(--sonte-icon) !important; }
#footer-social-icons { grid-template-columns: repeat(4, var(--sonte-icon)); gap: calc(12 * var(--sonte-unit)) !important; }

#hero-copy-card { padding: var(--sonte-card-pad); border-radius: calc(28 * var(--sonte-unit)); }
#start h1 { font-size: clamp(18.36px, 2.671875vw, 85.5px) !important; }
#hero-copy-card { min-height: calc(7 * max(44px, calc(44 * var(--sonte-unit))) + 16 * var(--sonte-unit)); }
#hero-tagline { font-size: calc(20.8 * var(--sonte-unit)) !important; margin-top: calc(28 * var(--sonte-unit)) !important; padding-top: calc(20 * var(--sonte-unit)); top: calc(10 * var(--sonte-unit)); }
#hero-tagline::before { left: calc(-1 * var(--sonte-card-pad)); right: calc(-1 * var(--sonte-card-pad)); top: calc(-10 * var(--sonte-unit)); }
#start #hero-layout { gap: calc(48 * var(--sonte-unit)); }
#product-selector-slot { flex-basis: calc(64 * var(--sonte-unit)); width: calc(64 * var(--sonte-unit)); }
#product-selector.product-selector:not(.application-toolbar) { padding: calc(8 * var(--sonte-unit)) !important; border-radius: 0 calc(28 * var(--sonte-unit)) calc(28 * var(--sonte-unit)) 0 !important; }
#product-selector:not(.application-toolbar) .product-choice { min-width: max(44px, calc(44 * var(--sonte-unit))); min-height: max(44px, calc(44 * var(--sonte-unit))); }
#product-selector:not(.application-toolbar) .product-choice > div { width: calc(40 * var(--sonte-unit)) !important; height: calc(40 * var(--sonte-unit)) !important; }
#foil-test-hint { left: calc(4 * var(--sonte-unit)); width: calc(56 * var(--sonte-unit)); height: calc(156 * var(--sonte-unit)); padding: calc(14 * var(--sonte-unit)) calc(6 * var(--sonte-unit)); }
#foil-test-hint > span { font-size: calc(12 * var(--sonte-unit)); }
#foil-test-arrow { width: calc(20 * var(--sonte-unit)); height: calc(20 * var(--sonte-unit)); margin-top: calc(8 * var(--sonte-unit)); }
.product-name-tooltip { font-size: clamp(11px, 1vw, 32px); padding: calc(10 * var(--sonte-unit)) calc(13 * var(--sonte-unit)); max-width: min(calc(310 * var(--sonte-unit)), calc(100vw - 32px)); }
#hero-foil-cursor, #application-film-cursor { width: calc(190 * var(--sonte-unit)); height: calc(56 * var(--sonte-unit)); font-size: calc(15 * var(--sonte-unit)); }
#hero-foil-cursor > span { font-size: inherit; }

@media (min-width: 768px) {
 #start { padding-bottom: calc(90 * var(--sonte-unit)) !important; }
 #start #hero-layout { max-width: calc(100vw - min(33.6375vw, 1336.875px) - 80 * var(--sonte-unit)) !important; }
 #hero-sidebars { width: min(33.6375vw, 1336.875px); bottom: calc(90 * var(--sonte-unit)); }
 #hero-sidebars > div { grid-template-columns: calc(133.6875 * var(--sonte-unit)) minmax(0, 1fr); column-gap: calc(18.975 * var(--sonte-unit)); min-height: calc(189.75 * var(--sonte-unit)); padding: calc(25.875 * var(--sonte-unit)) calc(27.6 * var(--sonte-unit)) calc(25.875 * var(--sonte-unit)) calc(17.25 * var(--sonte-unit)); border-radius: calc(17.25 * var(--sonte-unit)) 0 0 calc(17.25 * var(--sonte-unit)); }
 #hero-sidebars > div > img { width: calc(163.875 * var(--sonte-unit)) !important; height: calc(293.25 * var(--sonte-unit)) !important; margin: calc(-117.625 * var(--sonte-unit)) 0 calc(-25.875 * var(--sonte-unit)) !important; }
 #hero-sidebars h3 { font-size: max(15.525px, calc(16.56 * var(--sonte-unit))); margin-bottom: calc(12.075 * var(--sonte-unit)); }
 #hero-sidebars p { font-size: max(13.8px, calc(13.8 * var(--sonte-unit))); }
}
#sonte-vorteile { padding-block: calc(110 * var(--sonte-unit)) !important; }
#sonte-vorteile > div { column-gap: calc(80 * var(--sonte-unit)) !important; }
#sonte-vorteile h2 { font-size: clamp(22.4px, 2.4vw, 76.8px) !important; }
#benefit-panels h3 { font-size: clamp(20px, 2vw, 64px) !important; margin-bottom: calc(20 * var(--sonte-unit)); }
#benefit-panels p { font-size: clamp(18px, 1.7vw, 54.4px) !important; }
#produkte { padding-block: calc(64 * var(--sonte-unit)) !important; }
#produkte > div > div:first-child { padding-top: calc(55 * var(--sonte-unit)); column-gap: calc(8 * var(--sonte-unit)) !important; }
#produkte :is(button, a) img { height: clamp(150px, 22.08vw, 883.2px) !important; }
#showcase-product-title { font-size: clamp(20px, 2vw, 64px) !important; margin-top: calc(8 * var(--sonte-unit)) !important; }
#showcase-product-description { font-size: clamp(18px, 1.8vw, 57.6px) !important; }
#sonte-usps { padding-block: calc(24 * var(--sonte-unit)) calc(76.8 * var(--sonte-unit)); }
#sonte-usps > div { gap: calc(25.6 * var(--sonte-unit)); }
#sonte-usps article { padding: calc(28.16 * var(--sonte-unit)); border-radius: calc(18 * var(--sonte-unit)); }
#sonte-usps svg { width: calc(48 * var(--sonte-unit)) !important; height: calc(48 * var(--sonte-unit)) !important; margin-bottom: calc(22 * var(--sonte-unit)); }
#sonte-usps h3 { font-size: clamp(24px, 1.8vw, 57.6px); margin-bottom: calc(14 * var(--sonte-unit)); }
#sonte-usps p { font-size: clamp(18px, 1.2vw, 38.4px); }
:is(#anwendungen, #kontakt) { padding-block: calc(90 * var(--sonte-unit)) !important; }
:is(#anwendungen, #kontakt) h2 { font-size: clamp(28px, 3vw, 96px) !important; margin-bottom: calc(30 * var(--sonte-unit)); }

.application-copy-card { --application-pad: calc(28 * var(--sonte-unit)); left: var(--application-pad); top: var(--application-pad); width: min(calc(448 * var(--sonte-unit)), calc(100% - 2 * var(--application-pad))); padding: var(--application-pad); border-radius: calc(24 * var(--sonte-unit)); }
.application-copy-card h3 { font-size: clamp(26px, 2.4vw, 76.8px); }
.application-copy-card p { font-size: clamp(18px, 1.5vw, 48px); margin: calc(18 * var(--sonte-unit)) calc(-1 * var(--application-pad)) 0; padding: calc(18 * var(--sonte-unit)) var(--application-pad) 0; }
#anwendungen #application-track { border-radius: calc(28 * var(--sonte-unit)); }
#application-track .application-slide { height: clamp(460px, 68vh, 2150px); }
#anwendungen #application-controls { gap: calc(18 * var(--sonte-unit)) !important; margin-top: calc(24 * var(--sonte-unit)); }
#application-controls .application-arrow { width: max(44px, calc(50 * var(--sonte-unit))); height: max(44px, calc(50 * var(--sonte-unit))); }
.application-arrow svg { width: calc(24 * var(--sonte-unit)); height: calc(24 * var(--sonte-unit)); }
#application-dots button { width: max(36px, calc(36 * var(--sonte-unit))); height: max(44px, calc(44 * var(--sonte-unit))); }
#application-dots button::before { width: calc(10 * var(--sonte-unit)); height: calc(10 * var(--sonte-unit)); }
#application-track .application-film-switch { right: calc(28 * var(--sonte-unit)); bottom: calc(28 * var(--sonte-unit)); padding: calc(15 * var(--sonte-unit)) calc(24 * var(--sonte-unit)); font-size: clamp(16px, 1.40625vw, 45px); }

#kontakt > div > :last-child { height: var(--sonte-field-height); padding: var(--sonte-field-pad) calc(30 * var(--sonte-unit)) !important; border-radius: calc(18 * var(--sonte-unit)) !important; }
.sonte-contact-screen, #kontakt .sonte-contact-input-row { height: var(--sonte-field-inner); min-height: var(--sonte-field-inner); }
.sonte-contact-message .sonte-contact-screen, #kontakt .sonte-contact-message .sonte-contact-input-row { height: var(--message-height, var(--sonte-field-inner)); }
#kontakt .sonte-contact-input-row { grid-template-columns: minmax(0, 1fr) max(44px, calc(52 * var(--sonte-unit))); gap: calc(20 * var(--sonte-unit)); }
#kontakt :is(input, textarea), #kontakt :is(input, textarea)::placeholder, .sonte-contact-prompt { font-size: clamp(18px, 2.1875vw, 70px) !important; }
#kontakt .sonte-contact-input-row textarea { height: var(--sonte-field-inner); }
#kontakt .sonte-contact-input-row textarea.sonte-message-empty { padding-top: calc((var(--sonte-field-inner) - 1.4em) / 2); }
#kontakt > div > :last-child.sonte-contact-message { height: calc(var(--message-height, var(--sonte-field-inner)) + 2 * var(--sonte-field-pad)); }
.sonte-contact-next { width: max(44px, calc(52 * var(--sonte-unit))); height: max(44px, calc(52 * var(--sonte-unit))); padding: calc(14 * var(--sonte-unit)); }
.sonte-contact-next svg { width: calc(24 * var(--sonte-unit)) !important; height: calc(24 * var(--sonte-unit)) !important; }
.sonte-contact-choices { gap: calc(12 * var(--sonte-unit)); }
.sonte-contact-choices button { min-height: 44px; font-size: clamp(16px, 1.5625vw, 50px); padding: calc(12 * var(--sonte-unit)) calc(22 * var(--sonte-unit)); }
.sonte-newsletter-choices { width: min(100%, calc(360 * var(--sonte-unit))); }
.sonte-contact-status { font-size: clamp(14px, 1.328125vw, 42.5px); }

#site-footer { padding-block: calc(70 * var(--sonte-unit)) calc(36 * var(--sonte-unit)) !important; }
#site-footer > div > div:first-child { gap: calc(32 * var(--sonte-unit)) !important; }
#site-footer :is(p, a, span) { font-size: clamp(18px, 1.71875vw, 55px) !important; }
#site-footer > div > div:first-child > div:first-child img { width: clamp(145px, 16vw, 512px) !important; }
#site-footer > div > div:first-child > div:first-child p { margin-top: calc(26 * var(--sonte-unit)); }
#footer-social-icons { margin-top: calc(14 * var(--sonte-unit)) !important; }
#site-footer > div > div:last-child { margin-top: calc(64 * var(--sonte-unit)); padding-top: calc(24 * var(--sonte-unit)); }
#site-footer > div > div:last-child :is(p, a, span) { font-size: clamp(16px, 1.40625vw, 45px) !important; }

@media (max-width: 767px) {
 :root { --sonte-unit: clamp(.85px, .25641vw, 1.15px); --sonte-card-pad: clamp(18px, 5vw, 28px); --sonte-icon: clamp(18px, 5.641vw, 25.3px); }
 .site-header { padding-block: calc(12 * var(--sonte-unit)) !important; }
 .site-header > a img { width: clamp(130px, 37.18vw, 167px) !important; }
 .site-header #header-socials { margin-left: 0 !important; gap: 4px !important; }
 .site-header #header-socials .header-social-link, #footer-social-icons a { width: 44px; height: 44px; }
 #footer-social-icons { grid-template-columns: repeat(4, 44px); gap: 4px !important; }
 #mobile-menu-toggle svg { width: clamp(24px, 6.667vw, 30px) !important; height: clamp(24px, 6.667vw, 30px) !important; }
 #mobile-main-navigation a { font-size: clamp(18px, 4.615vw, 22px) !important; }
 #mobile-contact-navigation a { font-size: clamp(15px, 3.846vw, 18px) !important; }
 #start h1 { font-size: clamp(13px, 3.888vw, 29.8px) !important; }
 #hero-tagline { font-size: clamp(12px, 3.487vw, 24px) !important; margin-top: calc(18 * var(--sonte-unit)) !important; }
 #hero-copy-card { min-height: calc(264 * var(--sonte-unit)); border-radius: calc(22 * var(--sonte-unit)); }
 #start #hero-layout { gap: calc(47 * var(--sonte-unit)); }
 #product-selector-slot { flex-basis: calc(44 * var(--sonte-unit)); width: calc(44 * var(--sonte-unit)); }
 #product-selector.product-selector:not(.application-toolbar) { padding: calc(6 * var(--sonte-unit)) calc(4 * var(--sonte-unit)) !important; }
 #product-selector:not(.application-toolbar) .product-choice { min-width: 0; min-height: calc(36 * var(--sonte-unit)); width: calc(36 * var(--sonte-unit)); }
 #product-selector:not(.application-toolbar) .product-choice > div { width: calc(32 * var(--sonte-unit)) !important; height: calc(32 * var(--sonte-unit)) !important; }
 #foil-test-hint { left: calc(2 * var(--sonte-unit)); width: calc(40 * var(--sonte-unit)); height: calc(140 * var(--sonte-unit)); }
 #foil-test-hint > span { font-size: calc(10 * var(--sonte-unit)); }
 #produkte :is(button, a) img { height: clamp(150px, 40vw, 306px) !important; }
 #produkte > div > div:first-child { padding-top: calc(30 * var(--sonte-unit)); row-gap: calc(70 * var(--sonte-unit)) !important; }
 #showcase-product-title { margin-top: calc(32 * var(--sonte-unit)) !important; }
 .application-copy-card { --application-pad: calc(20 * var(--sonte-unit)); left: calc(16 * var(--sonte-unit)); top: calc(16 * var(--sonte-unit)); width: calc(100% - 32 * var(--sonte-unit)); }
 #application-track .application-slide { height: clamp(500px, 75svh, 700px); }
 #application-track .application-film-switch { right: calc(16 * var(--sonte-unit)); bottom: calc(16 * var(--sonte-unit)); }
 #kontakt .sonte-contact-choices { gap: 8px; }
 #kontakt .sonte-contact-choices button { padding: 10px 14px; }
 #kontakt .sonte-interest-choices { display: grid; grid-template-columns: 1fr; gap: 4px; }
 #kontakt .sonte-interest-choices button { min-height: 28px; padding: 4px 12px; }
}

/* Unfinished product pages share the same fluid scale as the homepage. */
.lp-hero, .lp-section { padding-block: calc(64 * var(--sonte-unit)); }
.lp-breadcrumbs { font-size: clamp(14px, 1.172vw, 37.5px); gap: calc(12 * var(--sonte-unit)); }
.lp-product-nav { gap: calc(8 * var(--sonte-unit)); margin-bottom: calc(46 * var(--sonte-unit)); }
.lp-product-nav a { font-size: clamp(14px, 1.25vw, 40px); padding: calc(10 * var(--sonte-unit)) calc(18 * var(--sonte-unit)); }
.lp-hero h1 { font-size: clamp(36px, 4.5vw, 144px); }
.lp-eyebrow { font-size: clamp(18px, 1.5vw, 48px); }
.lp-intro, .lp-contact > .lp-container > p { font-size: clamp(20px, 1.5vw, 48px); max-width: calc(740 * var(--sonte-unit)); }
.lp-section h2 { font-size: clamp(30px, 3vw, 96px); margin-bottom: calc(36 * var(--sonte-unit)); }
.lp-features { gap: calc(24 * var(--sonte-unit)); }
.lp-feature { padding: calc(32 * var(--sonte-unit)); border-radius: calc(18 * var(--sonte-unit)); }
.lp-feature > svg { width: calc(48 * var(--sonte-unit)); height: calc(48 * var(--sonte-unit)); margin-bottom: calc(22 * var(--sonte-unit)); }
.lp-feature h3 { font-size: clamp(22px, 1.8vw, 57.6px); }
.lp-feature p, .lp-use-copy p, .lp-faq p { font-size: clamp(18px, 1.3vw, 41.6px); }
.lp-button, .lp-text-link { font-size: clamp(17px, 1.40625vw, 45px); }
.lp-button { padding: calc(17 * var(--sonte-unit)) calc(26 * var(--sonte-unit)); }
.lp-actions svg, .lp-faq summary svg { width: var(--sonte-icon); height: var(--sonte-icon); }
.lp-faq summary { font-size: clamp(20px, 1.6vw, 51.2px); padding-block: calc(24 * var(--sonte-unit)); }
.lp-use-list li { font-size: clamp(16px, 1.328125vw, 42.5px); padding: calc(10 * var(--sonte-unit)) calc(18 * var(--sonte-unit)); }
.lp-photo img { height: clamp(380px, 43vw, 1700px); }
.product-page #kontakt > .lp-container { width: var(--sonte-content-width) !important; }
@media (max-width: 767px) {
 .lp-hero h1 { font-size: clamp(36px, 8vw, 61px); }
 .lp-photo img { height: clamp(300px, 90vw, 500px); max-width: 100%; }
}

/* Tablet layouts use readable card sizes instead of a shrunken desktop row. */
@media (min-width: 768px) and (max-width: 1199px) {
 :root { --sonte-header-width: 90vw; --sonte-header-padding: 0px; --sonte-icon: 22px; --sonte-card-pad: clamp(28px, 3.4vw, 40px); }
 .site-header { grid-template-columns: 1fr auto !important; row-gap: 0 !important; padding-block: 14px !important; }
 .site-header > a { grid-column: 1 !important; grid-row: 1 !important; justify-self: start !important; }
 .site-header > a img { width: clamp(180px, 22vw, 224px) !important; }
 #mobile-menu-toggle { display: flex; align-items: center; justify-content: center; grid-column: 2; grid-row: 1; width: 48px; height: 48px; }
 #mobile-menu-toggle svg { width: 28px !important; height: 28px !important; }
 .site-header nav { display: none !important; position: absolute; left: 0; right: 0; background: #fff; z-index: 60; margin: 0; }
 .site-header.mobile-menu-open nav { display: flex !important; }
 #mobile-main-navigation { top: 100%; height: 136px; box-sizing: border-box; padding: 16px 24px !important; flex-direction: column; align-items: stretch; justify-content: center !important; gap: 4px !important; grid-row: auto !important; }
 #mobile-main-navigation a { font-size: 22px !important; justify-content: flex-start; min-height: 44px; padding: 0 !important; }
 #mobile-contact-navigation { top: calc(100% + 136px); grid-row: auto !important; padding: 16px 24px 24px !important; justify-content: flex-start !important; gap: 20px !important; box-shadow: 0 16px 24px #05314618; }
 #mobile-contact-navigation > a { font-size: 20px !important; min-height: 44px; }
 .site-header #header-socials { gap: 4px !important; margin-left: 0 !important; }
 .site-header #header-socials .header-social-link { width: 44px; height: 44px; }

 #start { padding-bottom: 56px !important; }
 #start #hero-layout { max-width: calc(100vw - 40px) !important; gap: 44px; }
 #start h1 { font-size: clamp(26px, 3.2vw, 36px) !important; }
 #hero-tagline { font-size: clamp(17px, 2vw, 22px) !important; }
 #product-selector-slot { flex-basis: 60px; width: 60px; }
 #product-selector:not(.application-toolbar) .product-choice { min-width: 44px; min-height: 44px; }
 #product-selector:not(.application-toolbar) .product-choice > div { width: 36px !important; height: 36px !important; }
 #foil-test-hint { left: 5px; width: 50px; height: 150px; padding: 16px 6px; }
 #foil-test-hint > span { font-size: 12px; }
 #foil-test-arrow { width: 22px; height: 22px; }

 #sonte-vorteile { min-height: 0 !important; padding-block: clamp(56px, 7vw, 80px) !important; }
 #sonte-vorteile > div { grid-template-columns: minmax(0, 1fr) !important; row-gap: 36px !important; align-items: start !important; }
 #sonte-vorteile h2 { font-size: clamp(30px, 3.6vw, 38px) !important; }
 #benefit-panels { gap: 32px; }
 #benefit-panels h3 { font-size: clamp(22px, 2.4vw, 27px) !important; margin-bottom: 14px; }
 #benefit-panels p { font-size: clamp(19px, 2.1vw, 24px) !important; }

 #produkte { padding-block: 48px !important; }
 #produkte > div > div:first-child { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; gap: 36px 12px !important; padding-top: 24px; }
 #produkte > div > div:first-child > :is(button, a) { grid-column: span 2; }
 #produkte > div > div:first-child > :is(button, a):nth-child(5) { grid-column: 2 / span 2; }
 #produkte > div > div:first-child > :is(button, a):nth-child(6) { grid-column: 4 / span 2; }
 #produkte > div > div:first-child > :is(button, a):nth-child(7) { grid-column: 6 / span 2; }
 #produkte :is(button, a) img { height: clamp(190px, 25vw, 280px) !important; }
 #showcase-product-title { font-size: 26px !important; margin-top: 24px !important; }
 #showcase-product-description { font-size: 21px !important; }
 #sonte-usps > div { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
 #sonte-usps article { padding: 28px; }
 #sonte-usps h3 { font-size: 26px; }
 #sonte-usps p { font-size: 19px; }
 :is(#anwendungen, #kontakt) { padding-block: 64px !important; }
 :is(#anwendungen, #kontakt) h2 { font-size: clamp(32px, 3.6vw, 40px) !important; }
 #application-track .application-slide { height: clamp(420px, 48vw, 580px); }
 .application-copy-card { --application-pad: 24px; width: min(420px, 60%); }
 .application-copy-card h3 { font-size: 28px; }
 .application-copy-card p { font-size: 19px; }
 #application-track .application-film-switch { opacity: 1; pointer-events: auto; min-height: 44px; font-size: 18px; }
 #kontakt :is(input, textarea), #kontakt :is(input, textarea)::placeholder, .sonte-contact-prompt { font-size: clamp(22px, 2.4vw, 28px) !important; }
 #site-footer :is(p, a, span) { font-size: 21px !important; }
 #footer-social-icons { grid-template-columns: repeat(4, 44px); gap: 4px !important; }
 #footer-social-icons a { width: 44px; height: 44px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
 #hero-sidebars { display: none; }
 #hero-copy-card { flex: 1; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
 #start #hero-layout { max-width: calc(62vw - 32px) !important; gap: 36px; }
 #start h1 { font-size: clamp(24px, 2.4vw, 28px) !important; }
 #hero-copy-card { padding: 26px; }
 #hero-tagline { font-size: 17px !important; }
 #hero-tagline::before { left: -26px; right: -26px; }
 #hero-sidebars { width: 35vw; bottom: 56px; }
 #hero-sidebars > div { grid-template-columns: 92px minmax(0, 1fr); gap: 16px; padding: 24px 20px 24px 12px; }
 #hero-sidebars > div > img { width: 120px !important; height: 240px !important; margin-top: -72px !important; }
 #hero-sidebars h3 { font-size: 18px; }
 #hero-sidebars p { font-size: 15px; }
 #sonte-vorteile > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) !important; column-gap: 48px !important; }
}

/* Phones keep readable copy and omit the desktop film rail. */
@media (max-width: 767px) {
 :root { --sonte-card-pad: clamp(20px, 6.154vw, 28px); }
 .site-header { padding-block: 12px !important; }
 #mobile-menu-toggle { width: 48px; height: 48px; }
 #mobile-main-navigation { height: 128px; padding: 16px 24px !important; }
 #mobile-main-navigation a { min-height: 44px; padding: 0 !important; font-size: 22px !important; }
 #mobile-contact-navigation { top: calc(100% + 128px); flex-direction: column; align-items: stretch; flex-wrap: nowrap; padding-top: 0 !important; gap: 8px !important; }
 #mobile-contact-navigation > a { min-height: 44px; padding: 0 !important; justify-content: flex-start; font-size: 22px !important; }
 .site-header #header-socials { flex-basis: auto; width: 100%; margin-top: 12px; justify-content: flex-start; align-self: flex-start; }

 #start { min-height: calc(100svh - var(--sonte-header-height, 90px)) !important; height: auto !important; padding: max(160px, 24svh) 0 24px !important; }
 #start > div:first-of-type { width: calc(100% - 32px) !important; margin: 0 auto !important; left: 0 !important; top: 0 !important; }
 #start #hero-layout { width: calc(100% - 32px) !important; max-width: calc(100% - 32px) !important; margin: 0 auto !important; flex-direction: column; align-items: stretch; gap: 0; }
 #hero-copy-card { order: 0; width: 100%; min-height: 0; flex: none; border-radius: 22px; }
 #start h1 { font-size: clamp(18px, 5.128vw, 26px) !important; line-height: 1.24 !important; text-wrap: initial !important; }
 #hero-tagline { font-size: clamp(16px, 4.359vw, 20px) !important; line-height: 1.4; top: 0; margin-top: 24px !important; padding-top: 16px; }
 #hero-tagline::before { top: 0; }
 #product-selector-slot { display: none !important; }

 #sonte-vorteile { min-height: 0 !important; padding-block: 48px !important; }
 #sonte-vorteile > div { grid-template-columns: minmax(0, 1fr) !important; row-gap: 28px !important; text-align: center; }
 #sonte-vorteile h2 { font-size: clamp(26px, 7.18vw, 32px) !important; text-wrap: balance; }
 #benefit-panels { gap: 28px; }
 #benefit-panels h3 { font-size: 21px !important; margin-bottom: 14px; line-height: 1.3; text-wrap: balance; }
 #benefit-panels p { font-size: 18px !important; line-height: 1.5; text-wrap: balance; }
 #produkte { padding-block: 40px !important; }
 #produkte > div > div:first-child { width: 100% !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 28px 12px !important; padding-top: 16px; }
 #produkte > div > div:first-child > :is(button, a):last-child { grid-column: 2; width: 100%; justify-self: center; }
 #produkte :is(button, a) img { height: clamp(145px, 40vw, 210px) !important; transform: scale(1.2); }
 #showcase-product-title { font-size: 23px !important; margin-top: 24px !important; }
 #showcase-product-description { font-size: 18px !important; }
 #sonte-usps { padding-block: 8px 48px; }
 #sonte-usps > div { gap: 16px; }
 #sonte-usps article { padding: 24px; }
 #sonte-usps h3 { font-size: 25px; }
 #sonte-usps p { font-size: 18px; }
 :is(#anwendungen, #kontakt) { padding-block: 48px !important; }
 :is(#anwendungen, #kontakt) h2 { font-size: 28px !important; margin-bottom: 24px; }
 #application-track .application-slide { height: clamp(420px, 120vw, 540px); }
 .application-copy-card { --application-pad: 20px; left: 16px; top: 16px; width: calc(100% - 32px); }
 .application-copy-card h3 { font-size: 25px; }
 .application-copy-card p { font-size: 18px; margin-top: 16px; padding-top: 16px; }
 #application-track .application-film-switch { font-size: 16px; padding: 12px 18px; }
 #kontakt > div > :last-child { padding-inline: 18px !important; }
 #kontakt .sonte-contact-input-row { grid-template-columns: minmax(0, 1fr) 44px; gap: 12px; }
 #kontakt :is(input, textarea), #kontakt :is(input, textarea)::placeholder { font-size: 22px !important; }
 .sonte-contact-prompt { font-size: 18px !important; }
 .sonte-contact-next { width: 44px; height: 44px; padding: 10px; }
 #site-footer { padding-block: 48px 24px !important; text-align: center; }
 #site-footer > div > div:first-child { gap: 28px !important; }
 #site-footer > div > div:first-child > div { align-items: center; }
 #site-footer > div > div:first-child > div:first-child img { margin-inline: auto; }
 #site-footer > div > div:first-child > div:first-child p { text-wrap: balance; }
 #site-footer :is(p, a, span) { font-size: 18px !important; }
 #footer-social-icons { margin-inline: auto; }
 #site-footer > div > div:last-child { justify-content: center; margin-top: 40px; padding-top: 20px; }
}
