:root {
    --ink: #173c45;
    --ink-soft: #47636a;
    --paper: #fbfaf6;
    --white: #ffffff;
    --mint: #dcefe9;
    --mint-deep: #b9dfd5;
    --yellow: #f2c86a;
    --blue: #9bcbd1;
    --green: #a6d5bb;
    --line: rgba(23, 60, 69, .15);
    --shadow: 0 20px 50px rgba(23, 60, 69, .10);
    --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Segoe UI", Arial, sans-serif; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
*:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.container { width: min(1160px, calc(100% - 48px)); margin: 0 auto; }
.skip-link { position: absolute; left: -9999px; top: 12px; background: var(--ink); color: white; padding: 10px 15px; z-index: 10; }
.skip-link:focus { left: 12px; }

.topline { background: var(--ink); color: rgba(255,255,255,.78); font-size: .78rem; letter-spacing: .04em; }
.topline-inner { display:flex; justify-content:space-between; padding: 9px 0; }
.topline a { color: var(--white); }
.site-header { position: relative; z-index: 2; background: rgba(251,250,246,.96); border-bottom: 1px solid rgba(23,60,69,.08); }
.nav-wrap { min-height: 90px; display:flex; align-items:center; justify-content:space-between; gap: 26px; }
.brand { display:flex; align-items:center; gap: 12px; }
.brand-mark { display:grid; place-items:center; width: 46px; height: 46px; border-radius: 50% 50% 50% 8px; color: var(--white); background: var(--ink); font-weight: 800; letter-spacing: -.08em; transform: rotate(-8deg); }
.brand-mark-image { flex:0 0 104px; width:104px; height:46px; overflow:hidden; border-radius:0; transform:none; background:transparent; }
.brand-mark-image img { width:100%; height:100%; max-width:100%; object-fit:contain; object-position:center; transform:none; }
.brand-copy { display:flex; flex-direction:column; line-height:1.05; }
.brand-copy strong { font-size: 1.12rem; letter-spacing: -.03em; }
.brand-copy small { margin-top: 5px; color: var(--ink-soft); font-size: .68rem; letter-spacing: .13em; text-transform:uppercase; }
.main-nav { display:flex; align-items:center; gap: 25px; font-size: .83rem; font-weight: 700; }
.main-nav a { position:relative; padding: 8px 0; color: var(--ink-soft); }
.main-nav a:hover, .main-nav a.is-active { color:var(--ink); }
.main-nav a.is-active::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--yellow); border-radius:4px; }
.nav-dropdown { position:relative; }
.nav-dropdown > a { display:inline-flex; align-items:center; gap:7px; }
.nav-dropdown > a span { font-size:.95rem; line-height:1; transition:transform .2s ease; }
.nav-dropdown:hover > a span, .nav-dropdown:focus-within > a span { transform:rotate(180deg); }
.nav-dropdown.is-active > a { color:var(--ink); }
.nav-dropdown.is-active > a::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; background:var(--yellow); border-radius:4px; }
.nav-submenu { position:absolute; top:calc(100% + 12px); left:-18px; display:grid; min-width:250px; padding:12px; border:1px solid var(--line); border-radius:14px; background:var(--white); box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .2s ease, transform .2s ease, visibility .2s ease; }
.nav-submenu::before { content:""; position:absolute; top:-7px; left:26px; width:12px; height:12px; border-top:1px solid var(--line); border-left:1px solid var(--line); background:var(--white); transform:rotate(45deg); }
.nav-dropdown:hover .nav-submenu, .nav-dropdown:focus-within .nav-submenu { opacity:1; visibility:visible; transform:translateY(0); }
.nav-submenu a { padding:10px 12px; border-radius:8px; color:var(--ink-soft); font-size:.8rem; }
.nav-submenu a:hover, .nav-submenu a:focus-visible { color:var(--ink); background:var(--mint); }
.menu-toggle { display:none; border: 1px solid var(--line); background:var(--white); color:var(--ink); border-radius: 10px; padding: 9px 12px; }

.hero { position:relative; overflow:hidden; background: radial-gradient(circle at 88% 18%, rgba(255,255,255,.68), transparent 22%), var(--mint); }
.hero::after { content:""; position:absolute; width:360px; height:360px; right:-180px; bottom:-205px; border:36px solid rgba(255,255,255,.3); border-radius:50%; pointer-events:none; }
.hero-grid { min-height: 565px; display:grid; grid-template-columns: 1fr .95fr; align-items:center; gap: 50px; }
.eyebrow { margin:0 0 15px; color: var(--ink-soft); font-size:.75rem; font-weight:800; text-transform:uppercase; letter-spacing:.15em; }
h1, h2, h3, p { margin-top:0; }
h1, h2, h3 { line-height:1.05; letter-spacing:-.045em; }
h1 { max-width: 650px; margin-bottom: 22px; font-size: clamp(3.3rem, 6.2vw, 5.75rem); font-weight:800; }
#main-content h1, #main-content h2, #main-content h3 { color:var(--ink); }
h2 { margin-bottom: 20px; font-size: clamp(2rem, 3.7vw, 3.6rem); }
h3 { font-size: 1.65rem; }
.hero-lead { max-width: 470px; color: var(--ink-soft); font-size: 1.19rem; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap: 25px; margin-top: 35px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap: 18px; min-height: 50px; padding: 13px 20px; border:0; border-radius: 999px; font-weight:800; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); box-shadow: 0 10px 18px rgba(23,60,69,.14); }
.button-primary { background:var(--ink); color:var(--white); }
.button-light { background:var(--white); color:var(--ink); }
.text-link { display:inline-flex; gap: 10px; align-items:center; font-weight:800; border-bottom:2px solid var(--yellow); padding-bottom:3px; }
.text-link span { font-size: 1.25rem; }
.hero-art { position:relative; min-height: 430px; }
.art-card { position:absolute; overflow:hidden; display:flex; align-items:flex-end; padding: 22px; color:var(--white); background:linear-gradient(140deg, rgba(23,60,69,.15), rgba(23,60,69,.72)), linear-gradient(35deg, #7eafb5, #d6bb70); box-shadow:var(--shadow); }
.art-card span { font-size: .78rem; letter-spacing:.08em; text-transform:uppercase; font-weight:800; }
.art-card-main { inset: 35px 45px 30px 35px; border-radius: 40px 40px 40px 7px; background-size:cover; background-position:center; }
.art-card-small { right: 0; bottom: 0; width: 190px; height: 150px; border-radius: 20px 7px 20px 20px; background:linear-gradient(140deg, rgba(23,60,69,.15), rgba(23,60,69,.72)), linear-gradient(35deg, #9fcbb4, #78aab0); }
.sun-shape { position:absolute; top: 0; left: 0; width: 86px; height: 86px; border: 13px solid var(--yellow); border-radius:50%; opacity:.9; }

.section-space { padding-top: 105px; padding-bottom: 105px; }
.intro-section { display:grid; grid-template-columns: .9fr 1.1fr; gap: 80px; }
.intro-copy { padding-top: 40px; color:var(--ink-soft); font-size:1.1rem; }
.section-heading-wide { max-width: 700px; }
.section-heading-wide > p:last-child { max-width:540px; color:var(--ink-soft); }
.audience-section { background:var(--paper); }
.audience-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:16px; margin-top:38px; }
.audience-card { min-height:275px; display:flex; flex-direction:column; justify-content:space-between; padding:27px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.audience-card:hover { transform:translateY(-4px); border-color:transparent; box-shadow:var(--shadow); }
.audience-card h3 { max-width:300px; margin:35px 0 12px; font-size:1.65rem; }
.audience-card p { max-width:330px; margin-bottom:20px; color:var(--ink-soft); font-size:.94rem; }
.audience-card-adults { background:var(--mint); }
.audience-card-youth { background:#f7efe0; }
.audience-card-partners { background:#eef4f1; }
.trust-strip { background:var(--ink); color:var(--white); }
.trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; }
.trust-grid > div { display:flex; min-height:130px; flex-direction:column; justify-content:center; padding:24px 28px; border-right:1px solid rgba(255,255,255,.16); }
.trust-grid > div:last-child { border-right:0; }
.trust-grid strong { margin-bottom:5px; color:var(--yellow); font-size:1.5rem; letter-spacing:-.03em; }
.trust-grid span { color:rgba(255,255,255,.74); font-size:.88rem; }
.section-tint { background: #f1f5ee; }
.card-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 45px; }
.offer-card { position:relative; min-height: 300px; display:flex; flex-direction:column; justify-content:space-between; padding: 28px; border-radius:var(--radius); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
.offer-card::after { content:""; position:absolute; width: 155px; height:155px; border-radius:50%; right:-50px; top:-50px; border: 20px solid rgba(255,255,255,.3); }
.offer-card:hover { transform: translateY(-5px); box-shadow:var(--shadow); }
.offer-card-yellow { background:var(--yellow); }
.offer-card-blue { background:var(--blue); }
.offer-card-green { background:var(--green); }
.card-number { display:block; font-size:.78rem; font-weight:900; letter-spacing:.1em; opacity:.72; }
.card-link { font-weight:800; }
.card-link span { margin-left:8px; font-size:1.25rem; }
.values-section { display:grid; grid-template-columns: 1.05fr .95fr; align-items:center; gap: 85px; }
.values-image { min-height: 400px; display:flex; align-items:flex-end; padding: 22px; border-radius: 8px 42px 42px 42px; color:var(--white); background: linear-gradient(140deg, rgba(23,60,69,.05), rgba(23,60,69,.7)), linear-gradient(35deg, #c8ab70, #84b2ad); box-shadow:var(--shadow); }
.values-image span { font-size:.76rem; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }
.values-copy { max-width: 470px; color:var(--ink-soft); font-size:1.05rem; }
.values-copy h2 { color:var(--ink); }
.values-copy .text-link { margin-top: 15px; color:var(--ink); }
.contact-banner { padding: 72px 0; background: linear-gradient(115deg, var(--ink), #245764); color: var(--white); }
.contact-banner .eyebrow { color:var(--mint-deep); }
.contact-banner h2 { max-width:650px; margin-bottom:0; }
.contact-banner-inner { display:flex; justify-content:space-between; align-items:center; gap:30px; }

.page-hero { background:var(--mint); padding: 90px 0 100px; }
.page-hero-inner { max-width: 820px; }
.page-hero-inner::before { content:"Haus Don Bosco / "; display:block; margin-bottom:22px; color:var(--ink-soft); font-size:.75rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.page-hero h1 { font-size:clamp(3rem, 6vw, 5.2rem); margin-bottom:20px; }
.page-hero p:last-child { max-width: 600px; margin-bottom:0; color:var(--ink-soft); font-size:1.2rem; }
.content-section { padding-top: 90px; padding-bottom: 110px; }
.content-narrow { max-width: 800px; }
.content-narrow h2 { font-size:clamp(2rem, 4vw, 3.3rem); }
.content-narrow > p { max-width: 730px; color:var(--ink-soft); font-size:1.08rem; }
.highlight-list { display:grid; gap: 12px; margin-top: 40px; }
.highlight-list div { display:flex; align-items:center; gap:18px; padding:18px 20px; border-top:1px solid var(--line); }
.highlight-list span { color:var(--ink-soft); font-weight:800; font-size:.8rem; }
.highlight-list strong { font-size:1rem; }
.principles-list { display:grid; gap:12px; margin:35px 0 0; padding:0; list-style:none; }
.principles-list li { position:relative; padding:16px 18px 16px 38px; border-left:3px solid var(--yellow); border-radius:0 10px 10px 0; background:var(--mint); color:var(--ink-soft); }
.principles-list li::before { content:"✓"; position:absolute; left:14px; color:var(--ink); font-weight:900; }
.inline-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:36px; }
.team-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:60px; }
.team-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); }
.portrait-placeholder { min-height:220px; display:grid; place-items:center; border-radius:16px; color:var(--ink-soft); background:linear-gradient(145deg, var(--mint), #f0e5c9); font-size:.76rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.team-card h3 { margin:20px 0 6px; font-size:1.35rem; }
.team-card p { margin-bottom:4px; color:var(--ink-soft); font-size:.9rem; }
.detail-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.detail-card { min-height:260px; padding:28px; border-radius:var(--radius); background:var(--mint); }
.detail-card:nth-child(2) { background:var(--blue); }
.detail-card:nth-child(3) { background:var(--yellow); }
.detail-card h2 { margin-top:55px; font-size:2rem; }
.detail-card p { color:var(--ink-soft); }
.offer-overview { margin-bottom:70px; }
.offer-table-wrap { overflow-x:auto; margin-top:32px; border:1px solid var(--line); border-radius:16px; background:var(--white); }
.offer-table { width:100%; min-width:680px; border-collapse:collapse; text-align:left; }
.offer-table th, .offer-table td { padding:17px 18px; border-bottom:1px solid var(--line); vertical-align:top; }
.offer-table thead th { color:var(--ink-soft); background:var(--mint); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.offer-table tbody th { font-size:.95rem; }
.offer-table tbody td { color:var(--ink-soft); font-size:.92rem; }
.offer-table tbody tr:last-child th, .offer-table tbody tr:last-child td { border-bottom:0; }
.visually-hidden { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.program-links { display:grid; gap:10px; margin-top:55px; }
.program-links a { display:grid; grid-template-columns:55px 1fr auto; gap:18px; align-items:center; padding:19px 20px; border-top:1px solid var(--line); }
.program-links a:hover { background:var(--mint); }
.program-links strong { font-size:1.05rem; }
.program-links a > span:last-child { color:var(--ink-soft); font-size:.82rem; font-weight:800; }
.program-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:start; }
.program-visual { min-height:420px; display:flex; align-items:flex-end; padding:24px; border-radius:12px 40px 40px 40px; color:var(--white); background:linear-gradient(140deg, rgba(23,60,69,.05), rgba(23,60,69,.72)), linear-gradient(35deg, #9bcbd1, #d6b66a); box-shadow:var(--shadow); }
.program-visual span { font-size:.76rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.offer-bullets { display:grid; gap:10px; margin:28px 0; padding:0; list-style:none; }
.offer-bullets li { padding:13px 16px 13px 38px; border-radius:10px; background:var(--mint); color:var(--ink-soft); }
.offer-bullets li::before { content:"✓"; display:inline-block; width:22px; margin-left:-24px; color:var(--ink); font-weight:900; }
.step-list { display:grid; gap:0; margin:28px 0; }
.step-list div { display:flex; gap:18px; align-items:center; padding:15px 0; border-top:1px solid var(--line); }
.step-list span { color:var(--ink-soft); font-size:.78rem; font-weight:900; }
.program-facts { display:grid; gap:0; margin:28px 0 8px; border-top:1px solid var(--line); }
.program-facts div { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid var(--line); }
.program-facts span { color:var(--ink-soft); font-size:.84rem; }
.program-facts strong { text-align:right; font-size:.88rem; }
.program-facts a { text-decoration:underline; text-decoration-color:var(--yellow); text-underline-offset:4px; }
.faq-list { display:grid; gap:8px; margin:30px 0; }
.faq-list details { border:1px solid var(--line); border-radius:12px; background:var(--white); }
.faq-list summary { padding:16px 18px; cursor:pointer; font-weight:800; list-style-position:inside; }
.faq-list details p { margin:0; padding:0 18px 17px; color:var(--ink-soft); font-size:.92rem; }
.audience-callouts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:30px 0; }
.audience-callouts > div { padding:20px; border-radius:14px; background:var(--mint); }
.audience-callouts > div:nth-child(2) { background:#f7efe0; }
.audience-callouts .eyebrow { margin-bottom:10px; font-size:.67rem; }
.audience-callouts h3 { margin-bottom:10px; font-size:1.25rem; }
.audience-callouts p:last-child { margin-bottom:0; color:var(--ink-soft); font-size:.9rem; }
.not-found-page { display:flex; gap:36px; align-items:center; max-width:820px; padding:45px; border-radius:var(--radius); background:var(--mint); }
.not-found-code { color:var(--ink-soft); font-size:clamp(3rem, 10vw, 7rem); font-weight:900; line-height:1; }
.not-found-page h2 { margin-bottom:12px; font-size:2.4rem; }
.legal-placeholder { display:flex; gap:25px; align-items:flex-start; max-width:850px; padding:34px; border:1px solid var(--line); border-radius:var(--radius); background:#f7efe0; }
.legal-placeholder h2 { margin-bottom:12px; font-size:2.2rem; }
.legal-placeholder p { color:var(--ink-soft); }
.download-box { display:flex; gap:25px; align-items:flex-start; padding:32px; border-radius:var(--radius); background:var(--mint); }
.download-icon { display:grid; place-items:center; width:55px; height:55px; border-radius:50%; background:var(--ink); color:white; font-size:1.5rem; }
.download-box h2 { margin-bottom:10px; font-size:2rem; }
.download-box .button { margin-top:15px; }
.partner-list, .funding-strip { display:flex; flex-wrap:wrap; gap:10px; margin-top:35px; }
.partner-list span, .funding-strip span { padding:11px 16px; border-radius:999px; background:var(--mint); font-weight:700; font-size:.88rem; }
.funding-strip span:nth-child(2n) { background:var(--yellow); }
.legacy-badges { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin-top:28px; }
.legacy-badges img { width:160px; height:78px; object-fit:contain; background:var(--white); padding:5px; border-radius:10px; }
.contact-grid { display:grid; grid-template-columns: .8fr 1.2fr; gap:80px; max-width: 950px; }
.contact-grid h2 { font-size:2.5rem; }
address { font-style:normal; color:var(--ink-soft); font-size:1.1rem; }
.contact-grid a { text-decoration:underline; text-decoration-color:var(--yellow); text-underline-offset:4px; }
.contact-form { display:grid; gap:8px; }
.form-note { margin-bottom:10px; padding:12px 14px; border-radius:10px; color:var(--ink-soft); background:var(--mint); font-size:.84rem !important; }
.form-success, .form-error { margin:0 auto 24px; max-width:950px; padding:14px 16px; border-radius:10px; font-weight:800; }
.form-success { color:#175b39; background:#e6f4ea; border:1px solid #a9d9b5; }
.form-error { color:#7a2424; background:#fff0ee; border:1px solid #e5aaa2; }
.contact-form label { margin-top:7px; font-size:.85rem; font-weight:800; }
.contact-form input, .contact-form textarea { width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 14px; color:var(--ink); background:var(--white); }
.contact-form select { width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 14px; color:var(--ink); background:var(--white); }
.contact-form textarea { resize:vertical; }
.contact-form .button { justify-self:start; margin-top:14px; }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }

.site-footer { padding: 65px 0 25px; background: #e8f0eb; }
.footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; }
.brand-footer { margin-bottom: 18px; }
.footer-note, .site-footer p { color:var(--ink-soft); font-size:.9rem; }
.footer-label { margin-bottom:12px; color:var(--ink); font-weight:900; text-transform:uppercase; letter-spacing:.12em; font-size:.73rem !important; }
.site-footer a:hover { text-decoration:underline; text-decoration-color:var(--yellow); text-underline-offset:4px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:50px; padding-top:18px; border-top:1px solid var(--line); color:var(--ink-soft); font-size:.78rem; }
.mobile-contact-bar { display:none; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

@media print {
    body { color:#000; background:#fff; padding:0; font-size:11pt; }
    .topline, .main-nav, .menu-toggle, .hero-art, .hero-actions, .mobile-contact-bar, .button, .site-footer { display:none !important; }
    .site-header { border:0; }
    .nav-wrap { min-height:70px; }
    .hero, .section-tint, .contact-banner { background:#fff; }
    .hero-grid, .intro-section, .values-section, .contact-grid, .program-layout { display:block; min-height:0; }
    .section-space, .content-section { padding:25px 0; }
    a { text-decoration:underline; }
}

@media (max-width: 850px) {
    .container { width:min(100% - 34px, 680px); }
    .brand-mark-image { flex-basis:88px; width:88px; }
    body { padding-bottom:68px; }
    .nav-wrap { min-height:76px; }
    .menu-toggle { display:block; }
    .main-nav { display:none; position:absolute; top:100%; left:0; right:0; padding:16px 20px 22px; flex-direction:column; align-items:stretch; gap:5px; background:var(--paper); box-shadow:var(--shadow); }
    .main-nav.is-open { display:flex; }
    .nav-dropdown { width:100%; }
    .nav-dropdown > a { width:100%; justify-content:space-between; }
    .nav-submenu, .nav-dropdown:hover .nav-submenu, .nav-dropdown:focus-within .nav-submenu { position:static; display:none; min-width:0; margin:0 0 5px; padding:4px 0 4px 14px; border:0; box-shadow:none; opacity:1; visibility:visible; transform:none; background:transparent; }
    .nav-dropdown:hover .nav-submenu, .nav-dropdown:focus-within .nav-submenu { display:grid; }
    .nav-submenu::before { display:none; }
    .hero-grid, .intro-section, .values-section, .contact-grid { grid-template-columns:1fr; gap:45px; }
    .hero-grid { min-height:unset; padding-top:65px; padding-bottom:65px; }
    .hero-art { min-height:340px; }
    .intro-copy { padding-top:0; }
    .trust-grid { grid-template-columns:1fr; }
    .trust-grid > div { min-height:92px; border-right:0; border-bottom:1px solid rgba(255,255,255,.16); }
    .trust-grid > div:last-child { border-bottom:0; }
    .card-grid, .detail-grid, .team-grid { grid-template-columns:1fr; }
    .audience-grid { grid-template-columns:1fr; }
    .program-layout { grid-template-columns:1fr; gap:40px; }
    .program-visual { min-height:280px; }
    .audience-callouts { grid-template-columns:1fr; }
    .not-found-page { align-items:flex-start; flex-direction:column; padding:30px; }
    .program-links a { grid-template-columns:45px 1fr; }
    .program-links a > span:last-child { grid-column:2; }
    .offer-card { min-height:230px; }
    .section-space { padding-top:75px; padding-bottom:75px; }
    .contact-banner-inner { align-items:flex-start; flex-direction:column; }
    .mobile-contact-bar { position:fixed; z-index:5; right:0; bottom:0; left:0; display:grid; grid-template-columns:1fr 1fr; gap:1px; padding:8px; background:rgba(23,60,69,.96); box-shadow:0 -8px 24px rgba(23,60,69,.12); }
    .mobile-contact-bar a { display:flex; min-height:46px; align-items:center; justify-content:center; border-radius:9px; color:var(--ink); background:var(--white); font-size:.86rem; font-weight:900; }
    .mobile-contact-bar a:first-child { color:var(--white); background:var(--ink); }
    .footer-grid { grid-template-columns:1fr 1fr; }
    .footer-grid > div:first-child { grid-column:1 / -1; }
}

@media (max-width: 520px) {
    .topline-inner { font-size:.67rem; }
    .brand-mark-image { flex-basis:76px; width:76px; }
    .brand-copy strong { font-size:1rem; }
    .hero-art { min-height:270px; }
    .art-card-main { inset:25px 28px 20px 20px; }
    .art-card-small { width:145px; height:110px; padding:15px; }
    .sun-shape { width:60px; height:60px; border-width:9px; }
    .footer-grid { grid-template-columns:1fr; }
    .footer-bottom { flex-direction:column; gap:8px; }
    .download-box { flex-direction:column; }
}