/* =====================================================================
   DM-LANDING v1: /kalkulator, /cennik-drobnicy-morskiej, /koszt-drobnicy-morskiej
   Styl dodatkowy. Karta kalkulatora = ta sama karta .calc co na stronie glownej (build/app.css + mobile-home.css).
   Kolory: #34b6b9 (primary), #11868a (dark), #eafcfc (light), #bfe9ea, #df1b7f.
   ===================================================================== */
/* Czcionka i box-sizing TYLKO dla tresci i hero. Kalkulator (.dml-side) dziedziczy Lato i content-box
   z serwisu, dokladnie jak na stronie glownej. */
.dml-hero,.dml-main,.dml-trust,.dml-phone{font-family:'Segoe UI',Lato,system-ui,-apple-system,sans-serif;color:#1d3a3b;}
.dml-hero *,.dml-main *,.dml-trust *,.dml-phone *{box-sizing:border-box;}
.dml-main a,.dml-trust a,.dml-phone a{color:#11868a;}

/* ---------- HERO ---------- */
.dml-hero{position:relative;background:#16333e;color:#fff;border-radius:0 0 24px 24px;overflow:hidden;min-height:340px !important;height:auto !important;display:flex;align-items:center;padding:0;margin:0;}
.dml-hero-in h1{position:static;padding:0;text-transform:none;}
.dml-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.dml-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,28,36,.82) 0%,rgba(10,28,36,.55) 50%,rgba(10,28,36,.15) 100%);}
.dml-hero-in{position:relative;max-width:1600px;margin:0 auto;padding:48px 24px;width:100%;}
.dml-eyebrow{display:inline-flex;gap:8px;align-items:center;margin:0 0 12px;font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;color:#bfe9ea;}
.dml-eyebrow i{width:8px;height:8px;border-radius:50%;background:#df1b7f;display:inline-block;}
.dml-hero h1{margin:0 0 12px;font-size:2.1rem;line-height:1.2;max-width:840px;color:#fff;}
.dml-hero h1 em{color:#7fe0e2;font-style:normal;}
.dml-hero .dml-lead{max-width:740px;margin:0 0 20px;font-size:1.05rem;line-height:1.55;color:#dfeeee;}
.dml-chips{display:flex;gap:8px;flex-wrap:wrap;}
.dml-chip{padding:7px 12px;border:1px solid rgba(255,255,255,.35);border-radius:999px;font-size:.82rem;background:rgba(255,255,255,.08);color:#e6f6f6;}
.dml-chip b{color:#fff;}
.dml-hero-credit{position:absolute;right:16px;bottom:10px;font-size:.7rem;color:#8fb3b6;}

/* ---------- PRZYCISKI ---------- */
.dml-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:12px;font-weight:700;font-size:1rem;text-decoration:none;border:1px solid #34b6b9;background:#34b6b9;color:#fff;cursor:pointer;font-family:inherit;transition:background .15s ease;}
.dml-btn:hover{background:#11868a;border-color:#11868a;color:#fff;}
.dml-btn--ghost{background:transparent;color:#11868a;}
.dml-btn--ghost:hover{background:#eafcfc;color:#11868a;}

/* ---------- UKLAD: tresc + przyklejony kalkulator ---------- */
.dml{overflow-x:clip;}
.dml-grid{box-sizing:border-box;width:100%;max-width:1600px;margin:0 auto;padding:32px 24px 60px;display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:40px;align-items:start;}
.dml-main{min-width:0;max-width:860px;width:100%;}
@media (max-width:1280px){.dml-grid{gap:28px;}}
/* --dml-header-h ustawia landing-kalkulator.js na zmierzona wysokosc przyklejonego naglowka (fallback 180px).
   BEZ z-index i BEZ isolation: popup podpowiedzi (#hint-popup, z-index 40) musi byc NAD karta (.calc ma z-index 0). */
.dml-side{min-width:0;width:100%;position:sticky;top:calc(var(--dml-header-h, 180px) + 16px);max-height:calc(100vh - var(--dml-header-h, 180px) - 32px);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#bfe9ea transparent;}
.dml-side::-webkit-scrollbar{width:6px;}
.dml-side::-webkit-scrollbar-thumb{background:#bfe9ea;border-radius:6px;}
/* Karta kalkulatora 1:1 ze strony glownej: .calc 400px + padding 40px (content-box) = 480px, wysokosc 601px z app.css.
   Nadpisujemy tylko to, co wynika z polozenia w kolumnie (sekcja bez stalej wysokosci, wyrownanie). */
.dml-side section.calculator{scroll-margin-top:calc(var(--dml-header-h, 180px) + 16px);height:auto;max-width:100%;padding:0;margin:0;background:transparent;}
.dml-side section.calculator .calculator__container{width:100%;max-width:100%;justify-content:center;}
.dml-side section.calculator .calc{box-sizing:content-box;width:400px;max-width:calc(100% - 80px);}
@media (max-width:768px){
  .dml-side section.calculator .calc{border-radius:18px;box-shadow:0 16px 40px rgba(17,134,138,.18);}
}
@media (max-width:1024px){
  .dml-grid{grid-template-columns:1fr;gap:28px;padding-top:24px;}
  .dml-side{position:static;max-height:none;overflow:visible;order:-1;max-width:520px;margin:0 auto;}
  .dml-side section.calculator .calculator__container{justify-content:center;}
  .dml-hero h1{font-size:1.6rem;}
  .dml-hero{min-height:280px;}
}

/* ---------- PASEK ZAUFANIA + REFERENCJE ---------- */
.dml-trust{margin-top:12px;border:1px solid #dce8e9;border-radius:14px;padding:12px 14px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center;background:#f7fbfb;}
.dml-trust b{display:block;font-size:1.05rem;color:#11868a;font-variant-numeric:tabular-nums;}
.dml-trust span{font-size:.68rem;letter-spacing:1px;text-transform:uppercase;color:#6b8284;}
.dml-trust a{grid-column:1/-1;font-size:.85rem;text-decoration:none;font-weight:700;}
.dml-phone{margin-top:12px;font-size:.86rem;color:#41585a;text-align:center;}
.dml-phone a{font-weight:700;text-decoration:none;}
.dml-quotes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 22px;}
.dml-quote{border:1px solid #dce8e9;border-left:4px solid #df1b7f;border-radius:14px;padding:14px 16px;background:#f7fbfb;}
.dml-quote p{margin:0 0 8px;font-style:italic;color:#16333e;}
.dml-quote b{font-size:.82rem;color:#6b8284;}
.dml-quotes .dml-more{grid-column:1/-1;text-decoration:none;font-weight:700;}
@media (max-width:600px){.dml-quotes{grid-template-columns:1fr;}}

/* ---------- TRESC ---------- */
.dml-main p{margin:0 0 14px;color:#41585a;line-height:1.6;}
.dml-main p.dml-intro{font-size:1.08rem;color:#16333e;padding:16px 20px;border-left:4px solid #34b6b9;background:#eafcfc;border-radius:0 14px 14px 0;}
.dml-toc{background:#f7fbfb;border:1px solid #dce8e9;border-radius:16px;padding:16px 20px;margin:0 0 26px;}
.dml-toc b{display:block;margin-bottom:6px;font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;color:#6b8284;}
.dml-toc ol{margin:0;padding-left:18px;columns:2;column-gap:24px;}
.dml-toc li{margin:3px 0;font-size:.92rem;}
.dml-toc a{text-decoration:none;}
@media (max-width:600px){.dml-toc ol{columns:1;}}
.dml-main h2{scroll-margin-top:calc(var(--dml-header-h, 180px) + 16px);font-size:1.5rem;line-height:1.25;margin:34px 0 10px;display:flex;gap:12px;align-items:center;color:#16333e;}
.dml-main h2 .dml-n{flex:0 0 34px;height:34px;border-radius:10px;background:#eafcfc;color:#11868a;display:inline-flex;align-items:center;justify-content:center;font-size:.95rem;}
.dml-main h3{font-size:1.1rem;margin:22px 0 8px;color:#16333e;}
.dml-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin:12px 0 18px;}
.dml-card{border:1px solid #dce8e9;border-radius:16px;padding:16px;background:#fff;}
.dml-card b{display:block;margin-bottom:6px;color:#16333e;}
.dml-card span{font-size:.9rem;color:#41585a;}
.dml-steps{counter-reset:dmls;display:grid;gap:12px;margin:10px 0 18px;}
.dml-step{display:flex;gap:14px;border:1px solid #dce8e9;border-radius:14px;padding:14px 16px;background:#fff;}
.dml-step:before{counter-increment:dmls;content:counter(dmls);flex:0 0 36px;height:36px;border-radius:50%;background:#11868a;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:900;}
.dml-step b{display:block;color:#16333e;}
.dml-step span{font-size:.92rem;color:#41585a;}
.dml-note{display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:#eafcfc;border:1px solid #bfe9ea;margin:12px 0 18px;font-size:.92rem;color:#1d3a3b;}
.dml-note--warn{background:#fff4f8;border-color:#f3c3d8;}
.dml-note i{flex:0 0 26px;height:26px;border-radius:8px;background:#11868a;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-weight:900;}
.dml-note--warn i{background:#df1b7f;}
.dml-cta{margin:18px 0;padding:18px 20px;border-radius:16px;background:linear-gradient(135deg,#11868a,#34b6b9);color:#fff;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.dml-cta b{font-size:1.05rem;color:#fff;}
.dml-cta span{display:block;font-size:.9rem;opacity:.92;color:#fff;}
.dml-cta .dml-btn{background:#fff;color:#11868a;border-color:#fff;}
.dml-cta .dml-btn:hover{background:#eafcfc;}
.dml-cta .dml-btn--chat{background:transparent;color:#fff;border-color:rgba(255,255,255,.7);}
.dml-cta .dml-btn--chat:hover{background:rgba(255,255,255,.15);}
.dml-cta-actions{display:flex;gap:10px;flex-wrap:wrap;}
.dml-twrap{overflow-x:auto;border:1px solid #dce8e9;border-radius:14px;margin:12px 0 8px;}
.dml-table{border-collapse:collapse;width:100%;min-width:520px;font-size:.93rem;}
.dml-table th,.dml-table td{padding:10px 12px;text-align:left;border-bottom:1px solid #dce8e9;}
.dml-table th{background:#f7fbfb;font-size:.78rem;letter-spacing:.5px;text-transform:uppercase;color:#6b8284;}
.dml-table td b{color:#11868a;white-space:nowrap;}
.dml-table tr:last-child td{border-bottom:0;}
.dml-table .dml-go{font-size:.78rem;white-space:nowrap;text-decoration:none;color:#11868a;border:1px solid #bfe9ea;border-radius:999px;padding:3px 9px;}
.dml-table .dml-go:hover{background:#eafcfc;}
.dml-small{font-size:.8rem;color:#6b8284;margin:6px 0 14px;}
.dml-fig{margin:16px 0;border-radius:16px;overflow:hidden;border:1px solid #dce8e9;background:#f7fbfb;}
.dml-fig img{display:block;width:100%;height:auto;aspect-ratio:16/7;object-fit:cover;}
.dml-fig figcaption{padding:10px 14px;font-size:.86rem;color:#41585a;}
.dml-hero-credit{font-size:.78rem;color:#c9dfe1;background:rgba(10,28,36,.45);padding:4px 10px;border-radius:8px;}
/* Zespol: sekcja .persons jak na stronie glownej, dopasowana do kolumny tresci */
.dml-main .persons.dml-persons{margin:8px 0 18px;}
.dml-main .persons.dml-persons .persons__container{width:100%;max-width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.dml-main .persons.dml-persons .persons__container div{flex:none;padding:10px 6px;}
.dml-main .persons.dml-persons .persons__container div img{width:150px;height:150px;object-fit:cover;border-radius:50%;margin-bottom:16px;}
.dml-main .persons.dml-persons .persons__container div p{margin:0;font-size:15px;line-height:1.35;}
.dml-main .persons.dml-persons .persons__container div p strong{margin-bottom:6px;}
.dml-main .persons.dml-persons .persons__container div p a{color:#7c7c7c;text-decoration:none;}
@media (max-width:700px){.dml-main .persons.dml-persons .persons__container{grid-template-columns:repeat(2,1fr);}}
.dml-faq details{border:1px solid #dce8e9;border-radius:14px;padding:0 16px;margin:8px 0;background:#fff;}
.dml-faq summary{padding:14px 0;font-weight:700;cursor:pointer;list-style:none;color:#16333e;}
.dml-faq summary::-webkit-details-marker{display:none;}
.dml-faq summary:before{content:"+";display:inline-block;width:22px;color:#34b6b9;font-weight:900;}
.dml-faq details[open] summary:before{content:"–";}
.dml-faq p{padding-bottom:14px;}
.dml-xlinks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:20px 0;}
.dml-xlinks a{display:block;text-decoration:none;border:1px solid #dce8e9;border-radius:14px;padding:14px 16px;color:#1d3a3b;background:#fff;}
.dml-xlinks a em{display:block;font-size:.75rem;letter-spacing:1.2px;text-transform:uppercase;color:#6b8284;font-style:normal;margin-bottom:4px;}
.dml-xlinks a b{color:#11868a;}
.dml-xlinks a:hover{border-color:#34b6b9;}

/* ---------- TRYB CIEMNY (body.darkmode z js.js) ---------- */
.darkmode .dml{color:#dfe9ea;}
.darkmode .dml-main p,.darkmode .dml-card span,.darkmode .dml-step span{color:#c6d4d6;}
.darkmode .dml-main h2,.darkmode .dml-main h3,.darkmode .dml-card b,.darkmode .dml-step b,.darkmode .dml-faq summary,.darkmode .dml-main p.dml-intro,.darkmode .dml-quote p{color:#eef6f6;}
.darkmode .dml-main p.dml-intro,.darkmode .dml-note{background:#123539;border-color:#1f5c60;color:#dfe9ea;}
.darkmode .dml-toc,.darkmode .dml-card,.darkmode .dml-step,.darkmode .dml-faq details,.darkmode .dml-xlinks a,.darkmode .dml-quote,.darkmode .dml-trust,.darkmode .dml-fig{background:#15262a;border-color:#27393d;color:#dfe9ea;}
.darkmode .dml-table th{background:#15262a;color:#93a5a7;}
.darkmode .dml-table td{border-color:#27393d;color:#dfe9ea;}
.darkmode .dml-twrap{border-color:#27393d;}
.darkmode .dml-xlinks a{color:#dfe9ea;}
.darkmode .dml-note--warn{background:#3a1424;border-color:#6d2544;}
.darkmode .dml-main h2 .dml-n{background:#123539;color:#7fe0e2;}
.darkmode .dml a{color:#7fe0e2;}

/* ---------- WCAG: powiekszona czcionka (setFontSize 'large') ---------- */
.dml-hero h1[data-hide-at]{}
