.elementor-37616 .elementor-element.elementor-element-57db557 .elementor-repeater-item-a4d4e2a{left:40%;--hotspot-translate-x:40%;top:40%;--hotspot-translate-y:40%;}.elementor-37616 .elementor-element.elementor-element-57db557 .elementor-repeater-item-ca81afd{left:55%;--hotspot-translate-x:55%;top:51%;--hotspot-translate-y:51%;}.elementor-37616 .elementor-element.elementor-element-57db557 .elementor-repeater-item-4d86ac2{left:50%;--hotspot-translate-x:50%;top:25%;--hotspot-translate-y:25%;}.elementor-37616 .elementor-element.elementor-element-57db557 .e-hotspot--tooltip-position{right:initial;bottom:initial;left:initial;top:calc(100% + 5px );}.elementor-37616 .elementor-element.elementor-element-57db557{--hotspot-color:#FF25259C;--tooltip-text-color:#141414;--tooltip-padding:8px 25px 8px 25px;--tooltip-color:#FFFFFFA1;--tooltip-border-radius:25px 25px 25px 25px;}.elementor-37616 .elementor-element.elementor-element-e98446b > .elementor-element-populated{padding:0px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-51e1188 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:30vw 0vw 0vw 0vw;}.elementor-37616 .elementor-element.elementor-element-8f96460 > .elementor-widget-container{padding:0px 0px 010px 0px;}.elementor-37616 .elementor-element.elementor-element-8f96460{text-align:center;}.elementor-37616 .elementor-element.elementor-element-05c356e > .elementor-widget-container{margin:-20px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-72e0882{margin-top:-30px;margin-bottom:0px;}.elementor-37616 .elementor-element.elementor-element-766b614 .elementor-button{background-color:#E68700;}.elementor-37616 .elementor-element.elementor-element-766b614 .elementor-button:hover, .elementor-37616 .elementor-element.elementor-element-766b614 .elementor-button:focus{color:#F0F0F0;}.elementor-37616 .elementor-element.elementor-element-766b614 .elementor-button:hover svg, .elementor-37616 .elementor-element.elementor-element-766b614 .elementor-button:focus svg{fill:#F0F0F0;}.elementor-37616 .elementor-element.elementor-element-59427cb > .elementor-widget-container{border-style:none;border-radius:15px 15px 15px 15px;}.elementor-37616 .elementor-element.elementor-element-36f037a > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-36f037a{text-align:center;}.elementor-37616 .elementor-element.elementor-element-d62217c > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-d62217c .elementor-swiper-button{font-size:20px;}.elementor-37616 .elementor-element.elementor-element-ea5dbfd .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-37616 .elementor-element.elementor-element-ea5dbfd .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-37616 .elementor-element.elementor-element-ea5dbfd{--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-37616 .elementor-element.elementor-element-1f3ae46{padding:30px 30px 30px 30px;}.elementor-37616 .elementor-element.elementor-element-d41ad3a > .elementor-widget-container{margin:020px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-d41ad3a .elementor-author-box__avatar img{width:200px;height:200px;}.elementor-37616 .elementor-element.elementor-element-4dae7cc > .elementor-widget-container{margin:0px 0px 50px 0px;}.elementor-37616 .elementor-element.elementor-element-4dae7cc .elementor-author-box__avatar img{width:200px;height:200px;}.elementor-37616 .elementor-element.elementor-element-6bad3f9 > .elementor-widget-container{padding:0% 25% 0% 25%;}.elementor-37616 .elementor-element.elementor-element-bd98e87 > .elementor-widget-container{margin:0px 0px 25px 0px;}@media(max-width:767px){.elementor-37616 .elementor-element.elementor-element-9034a13 > .elementor-widget-container{margin:0px 010px 0px 10px;}.elementor-37616 .elementor-element.elementor-element-51e1188 > .elementor-element-populated{padding:10vw 10vw 10vw 10vw;}.elementor-37616 .elementor-element.elementor-element-1f3ae46{padding:0px 0px 0px 0px;}.elementor-37616 .elementor-element.elementor-element-d41ad3a .elementor-author-box__avatar img{width:65px;height:65px;}.elementor-37616 .elementor-element.elementor-element-d41ad3a .elementor-author-box__name{font-size:17px;}.elementor-37616 .elementor-element.elementor-element-d41ad3a .elementor-author-box__bio{font-size:12px;}.elementor-37616 .elementor-element.elementor-element-4dae7cc .elementor-author-box__avatar img{width:65px;height:65px;}.elementor-37616 .elementor-element.elementor-element-4dae7cc .elementor-author-box__name{font-size:17px;}.elementor-37616 .elementor-element.elementor-element-4dae7cc .elementor-author-box__bio{font-size:12px;}.elementor-37616 .elementor-element.elementor-element-6bad3f9 > .elementor-widget-container{padding:0% 0% 0% 0%;}}@media(min-width:768px){.elementor-37616 .elementor-element.elementor-element-acac910{width:50%;}.elementor-37616 .elementor-element.elementor-element-e98446b{width:49.954%;}}/* Start custom CSS *//* ---------- 1. MÄÄRITELLÄÄN MUUTTUJAT (VÄRIT & ASETUKSET) ---------- */
:root {
  /* --- Brändivärit --- */
  --sun-orange: #ffa240;
  --sun-red:    #d73535;
  
  --df-a: #df8823; /* primary orange */
  --df-b: #eec946; /* secondary yellow */
  --df-c: #1f1a14; /* deep warm dark */
  --df-d: #111111; /* near black */
  --df-e: #4F5655; /* muted gray */
  --df-w: #ffffff;
  
    --link-color: #1e3a5f;

  /* --- UI Muuttujat --- */
  --bg: #fbfaf7;
  --line: rgba(31,26,20,0.14); /* Lämmin tumma viiva */
  --shadow: 0 16px 46px rgba(31,26,20,0.14);
  --shadow-sm: 0 12px 26px rgba(31,26,20,0.08);
  --r1: 18px; /* Pyöristys 1 */
  --r2: 26px; /* Pyöristys 2 */

  /* --- Liukuvärit --- */
  --span-gradient: linear-gradient(135deg, var(--sun-orange) 0%, var(--sun-red) 100%);
  
  
  
}

/* ---------- 2. BASE & RESET ---------- */
* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--df-d);
  /* BODY TAUSTA: Oranssit sävyt */
  background:
    radial-gradient(1100px 520px at 20% -10%, rgba(223,136,35,.12), transparent 55%),
    radial-gradient(900px 520px at 100% 10%, rgba(238,201,70,.10), transparent 55%),
    var(--bg);
}

/* --- CONTAINER-LOGIIKKA (KORJATTU) --- */
.container {
  max-width: 1080px;
  margin: 0 auto;
  /* MOBIILI: Ei reunoja (sivurakentaja hoitaa) */
  padding: 0; 
}

/* DESKTOP: Lisätään reunat vain isommille näytöille (yli 768px) */
@media (min-width: 768px) {
  .container {
    padding: 0 18px;
  }
}

/* ---------- 3. HEADER (Yläpalkki) ---------- */
.ast-primary-header-bar,
.ast-primary-header-bar.ast-primary-header,
.site-header,
.main-header-bar {
  background: var(--span-gradient) !important;
  border-bottom: none !important;
}

/* Logo, kuvaus, hamburger & ikonit → VALKOINEN */
.main-header-bar .site-title a,
.main-header-bar .site-description,
.main-header-bar .ast-mobile-menu-trigger-fill,
.main-header-bar .ast-icon svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* PÄÄVALIKKO (taso 1) → VALKOINEN */
.main-header-bar 
.main-header-menu 
> .menu-item 
> .menu-link {
  color: #ffffff !important;
  transition: opacity 0.3s ease;
}

/* Hover päätasolla */
.main-header-bar 
.main-header-menu 
> .menu-item 
> .menu-link:hover {
  opacity: 0.8;
}

/* ALATASOT (dropdown) → MUSTA */
.main-header-bar 
.main-header-menu 
.sub-menu 
.menu-link {
  color: #1f1a14 !important; /* df-c */
}

/* Hover / active alatasolla */
.main-header-bar 
.main-header-menu 
.sub-menu 
.menu-link:hover,
.main-header-bar 
.main-header-menu 
.sub-menu 
.current-menu-item > .menu-link {
  color: var(--df-a) !important;
}

/* Dropdownin tausta */
.main-header-bar 
.main-header-menu 
.sub-menu {
  background: #ffffff !important;
}



/* ---------- 4. FOOTER (Alapalkki) ---------- */
.site-footer,
.ast-footer-copyright {
  background: linear-gradient(135deg, #ffa240 0%, #d73535 100%) !important;
  border-top: none !important;
}

/* Footerin tekstit valkoiseksi */
.site-footer h1, .site-footer h2, .site-footer h3, .site-footer h4, .site-footer h5,
.site-footer p, 
.site-footer li, 
.site-footer span,
.ast-footer-copyright p,
.ast-footer-copyright span {
  color: #ffffff !important;
}

/* Footerin linkit */
.site-footer a,
.ast-footer-copyright a {
  color: #ffffff !important;
  text-decoration: none;
}

.site-footer a:hover,
.ast-footer-copyright a:hover {
  color: #ffe0b2 !important;
  text-decoration: underline;
  opacity: 1;
}

/* Footerin ikonit */
.site-footer .ast-icon svg,
.footer-widget-area svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* Footerin lomakekentät */
.site-footer input[type="text"],
.site-footer input[type="email"],
.site-footer textarea {
  background-color: #ffffff !important;
  color: #333333 !important;
  border: 1px solid rgba(255,255,255,0.4) !important;
}

.site-footer button,
.site-footer input[type="submit"] {
  background-color: #ffffff !important;
  color: #d73535 !important;
  font-weight: bold;
}

/* Footerin "Below Footer" -alueen siivous */
#colophon .site-below-footer-wrap,
.site-below-footer-wrap .ast-builder-grid-row {
  background-color: transparent !important;
  background-image: none !important;
  border-top: none !important;
  border: none !important;
  box-shadow: none !important;
}

.ast-footer-copyright {
  background: transparent !important;
}

/* ---------- 5. HERO / FIRST SECTION ---------- */
.hero { padding: 28px 0 18px; }

.hero-card {
  position: relative;
  border-radius: var(--r2);
  background:
    radial-gradient(1100px 520px at 20% -10%, rgba(223,136,35,.16), transparent 55%),
    radial-gradient(900px 520px at 100% 10%, rgba(238,201,70,.12), transparent 55%),
    linear-gradient(135deg, rgba(223,136,35,.18), rgba(238,201,70,.10)),
    #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.hero-card::before {
  content: "";
  position: absolute;
  inset: -70px -70px auto auto;
  width: 360px; height: 360px;
  background: radial-gradient(circle at 30% 30%, rgba(223,136,35,.20), transparent 65%);
  transform: rotate(18deg);
  pointer-events: none;
}

.hero-inner {
  display: grid;
  grid-template-columns: 1.18fr .82fr;
  gap: 18px;
  padding: 26px;
  align-items: stretch;
}
@media (max-width: 860px) {
  .hero-inner { grid-template-columns: 1fr; padding: 20px; }
}

.kicker {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  position: relative;
  z-index: 5;
  border: 1px solid rgba(31,26,20,.14);
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
  font-size: .78rem;
  color: rgba(31,26,20,.92);
}
.kicker .dot {
  width: 8px; height: 8px;
  border-radius: 999px;
  background: var(--df-b);
  box-shadow: 0 0 0 5px rgba(223,136,35,.18);
}

h1 {
  margin: 14px 0 10px;
  font-size: 2.25rem;
  line-height: 1.08;
  letter-spacing: -.02em;
  color: var(--df-d);
}
@media (max-width: 520px) {
  h1 { font-size: 1.85rem; }
}

.lead {
  margin: 0 0 16px;
  font-size: 1.06rem;
  line-height: 1.7;
  color: rgba(79,86,85,.95);
  max-width: 70ch;
}

.badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(31,26,20,.14);
  font-size: .92rem;
  color: rgba(31,26,20,.92);
}
.badge svg { width: 16px; height: 16px; opacity: .9; flex: 0 0 auto; }

.hero-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 16px;
}

/* ---------- 6. BUTTONS & UI ---------- */
.btn {
  appearance: none;
  border: 0;
  border-radius: 25px;
  padding: 8px 40px;
  font-weight: 900;
  letter-spacing: .01em;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none !important;
  user-select: none;
  color: var(--df-c);
}
.btn-primary {
  background: linear-gradient(135deg, var(--df-b), var(--df-a));
  color: var(--df-w) !important;
  box-shadow: 0 14px 28px rgba(223,136,35,.24);
}
.btn-ghost {
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(31,26,20,.16);
  color: rgba(31,26,20,.92);
}
.btn svg { width: 18px; height: 18px; opacity: .95; }

/* Right side info card */
.buy-card {
  border-radius: var(--r1);
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(31,26,20,.16);
  padding: 16px;
  backdrop-filter: saturate(1.1) blur(7px);
  box-shadow: 0 12px 26px rgba(31,26,20,.10);
}
.buy-title {
  margin: 0 0 10px;
  font-size: 1.05rem;
  color: rgba(31,26,20,.92);
}

.meta {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.meta li {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 10px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(253,248,242,.92); 
  border: 1px solid rgba(31,26,20,.10);
}
.meta strong { color: rgba(31,26,20,.92); }
.meta span { color: rgba(79,86,85,.98); line-height: 1.55; }

@media (max-width: 520px) {
  .meta li { grid-template-columns: 1fr; gap: 6px; }
}

.buy-note {
  margin: 12px 0 0;
  color: rgba(79,86,85,.98);
  font-size: .95rem;
  line-height: 1.6;
}

/* Mobile sticky CTA */
.sticky {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  background: rgba(255,255,255,.92);
  border-top: 1px solid rgba(31,26,20,.16);
  padding: 10px 12px;
  backdrop-filter: saturate(1.15) blur(10px);
  display: none;
  z-index: 30;
}
.sticky .row {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  padding: 0 6px;
}
.sticky .small {
  font-size: .92rem;
  color: rgba(79,86,85,.98);
  line-height: 1.25;
}
.sticky .btn { padding: 10px 12px; border-radius: 14px; }

@media (max-width: 760px) {
  .sticky { display: block; }
  body { padding-bottom: 74px; }
}

/* ---------- 7. CONTENT SECTIONS ---------- */
.section { padding: 32px 0; }

.card {
  background: var(--df-w);
  border: 1px solid var(--line);
  border-radius: var(--r1);
  box-shadow: 0 10px 26px rgba(31,26,20,.08);
  overflow: hidden;
}

.card-head {
  padding: 16px 18px 14px;
  background: linear-gradient(
    135deg,
    rgba(223,136,35,.12),
    rgba(238,201,70,.08)
  );
  border-bottom: 1px solid var(--line);
}

.card-head h2 {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.25;
  color: var(--df-c);
}

.card-body { padding: 18px; }

.muted { color: rgba(79,86,85,.95); }

/* Grid for content cards */
.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 860px) {
  .grid { grid-template-columns: 1fr; }
}

/* Lists */
.list {
  margin: 10px 0 0;
  padding-left: 18px;
  line-height: 1.75;
  color: rgba(31,26,20,.95);
}
.list li { margin: 6px 0; }

/* Highlight / CTA box inside content */
.df-cta {
  margin-top: 18px;
  padding: 16px 18px;
  border-radius: var(--r1);
  background: linear-gradient(
    135deg,
    rgba(223,136,35,.16),
    rgba(238,201,70,.08)
  );
  border: 1px solid rgba(31,26,20,.16);
}
.df-cta strong {
  display: block;
  font-size: 1.05rem;
  color: var(--df-c);
  margin-bottom: 6px;
}

.df-note {
  margin: 0;
  color: rgba(79,86,85,.98);
  font-size: .95rem;
  line-height: 1.6;
}

/* Stock Status */
.df-stock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 900;
}

/* 10–14 → tumma vihreä */
.df-stock--safe {
  color: #0f5e03; 
}

/* 5–9 → oranssi */
.df-stock--warn {
  color: #d97706; 
}

/* 1–4 + loppuunmyyty → punainen */
.df-stock--danger {
  color: #b91c1c;
}

.meta .df-stock--safe   { color: #0f5e03; }
.meta .df-stock--warn   { color: #d97706; }
.meta .df-stock--danger { color: #b91c1c; }

.meta .df-stock--safe strong,
.meta .df-stock--warn strong,
.meta .df-stock--danger strong {
  color: inherit;
}

.card--flat {
  box-shadow: none;
  background: transparent;
}

.intro-text {
  margin: 0;
  line-height: 1.7;
}
.intro-text + .intro-text {
  margin-top: 12px;
}

/* Linkit */
a {
  color: var(--df-a);
  text-decoration: none;
  transition: all 0.2s ease;
  font-weight: 600;
}
a:hover {
  color: #b86b12;
  text-decoration: underline;
}

/* ---------- 8. MODAL (Pop-up) ---------- */
.modal-overlay {
  display: none;
  position: fixed; 
  z-index: 99999;
  left: 0; top: 0;
  width: 100%; height: 100%; 
  background-color: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  align-items: center;
  justify-content: center;
}

.modal-content {
  background-color: #ffffff;
  margin: 20px;
  padding: 30px;
  border-radius: 26px;
  width: 100%;
  max-width: 500px;
  position: relative;
  box-shadow: 0 20px 50px rgba(0,0,0,0.3);
  text-align: center;
  animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
  from {transform: translateY(20px); opacity: 0;}
  to {transform: translateY(0); opacity: 1;}
}

.modal-content h3 {
  margin-top: 0;
  color: #1f1a14;
  font-size: 1.5rem;
}

.modal-text {
  font-size: 1rem;
  line-height: 1.6;
  color: #4F5655;
  margin-bottom: 16px;
  text-align: left;
}

.close-modal {
  color: #aaa;
  position: absolute;
  top: 15px; right: 20px;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  transition: color 0.2s;
}
.close-modal:hover { color: #d73535; }

.modal-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 24px;
}

.modal-btn {
  width: 100%;
  justify-content: center;
  padding: 14px 20px;
  font-size: 1.05rem;
}

.modal-btn.btn-ghost {
  border: 2px solid var(--df-a, #ff9500);
  color: var(--df-a, #ff9500);
  background: transparent;
}
.modal-btn.btn-ghost:hover {
  background: rgba(255, 149, 0, 0.1);
}

@media (max-width: 600px) {
  .modal-content {
    padding: 20px;
    width: 90%;
  }
}

/* ---------- 9. UUDET SISÄLTÖTYYLIT ---------- */

/* Otsikko */
.section-head { margin-bottom: 30px; }
.section-head h2 {
  font-size: 1.8rem;
  color: var(--df-c);
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}

/* Glass Card */
.glass-card {
  border-radius: 18px;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(31,26,20,.12);
  padding: 24px;
  backdrop-filter: saturate(1.1) blur(7px);
  box-shadow: 0 12px 26px rgba(31,26,20,.08);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.glass-card .card-head {
  padding: 0;
  background: transparent;
  border: 0;
  margin-bottom: 10px;
}
.glass-card h3 {
  margin: 0;
  font-size: 1.25rem;
  color: var(--df-c);
}

/* Check-lista */
.check-list { list-style: none; padding: 0; margin: 0; }
.check-list li {
  padding-left: 26px;
  position: relative;
  margin-bottom: 10px;
  color: #4F5655;
  line-height: 1.5;
}
.check-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 4px;
  width: 16px; height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23df8823' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

@media (max-width: 600px) {
  .hero-subtitle { font-size: 1.1rem; }
  .desktop-only { display: none; }
}

/* Kohderyhmä-laatikko */
.audience-box {
  background: rgba(255, 149, 0, 0.08); 
  border: 1px solid rgba(255, 149, 0, 0.15);
  border-radius: 20px;
  padding: 30px;
  margin: 30px 0;
  text-align: center;
}

.audience-head h3 {
  margin: 0 0 20px 0;
  color: var(--df-c);
  font-size: 1.4rem;
}

.audience-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.audience-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: #ffffff;
  padding: 10px 18px;
  border-radius: 99px;
  font-weight: 600;
  color: #333;
  font-size: 0.95rem;
  box-shadow: 0 4px 6px rgba(0,0,0,0.02);
  border: 1px solid rgba(0,0,0,0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.audience-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(255, 149, 0, 0.15);
  border-color: rgba(255, 149, 0, 0.3);
}

.audience-item svg {
  width: 18px; height: 18px;
  color: #2ecc71;
  flex-shrink: 0;
}

@media (max-width: 600px) {
  .audience-box { padding: 20px 15px; }
  .audience-item {
    font-size: 0.9rem;
    padding: 8px 14px;
    width: 100%;
    justify-content: center;
  }
}

/* Value Proposition Box */
.value-proposition-box { padding: 40px; }

.value-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-bottom: 30px;
}

.value-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.value-icon {
  flex-shrink: 0;
  width: 42px; height: 42px;
  background: rgba(255, 149, 0, 0.1);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--df-a);
}
.value-icon svg { width: 22px; height: 22px; }

.value-item strong {
  display: block;
  font-size: 1.05rem;
  color: var(--df-c);
  margin-bottom: 4px;
}

.value-item p {
  margin: 0;
  font-size: 0.95rem;
  color: #4F5655;
  line-height: 1.5;
}

.value-summary {
  background: linear-gradient(135deg, rgba(223,136,35,.15), rgba(238,201,70,.10));
  border: 1px solid rgba(223,136,35,.2);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  margin-top: 10px;
}

.value-summary strong {
  display: block;
  font-size: 1.15rem;
  color: var(--df-c);
  margin-bottom: 8px;
}

.value-summary p {
  margin: 0 auto;
  max-width: 70ch;
  color: #4F5655;
}

@media (max-width: 760px) {
  .value-proposition-box { padding: 24px 20px; }
  .value-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

a {
  color: var(--link-color);
  text-decoration: underline;
  transition: color 0.2s ease;
  font-weight: 600;
}
a:hover {
  color: #2563eb;
}/* End custom CSS */