/* CSS til ny styling som ikke kan indlejres på sider, produkter og produktkategorier */

@media (max-width: 768px) {
    .cards {
        grid-template-columns: 1fr!important;
    }
	.pageTypeproduct .site-main-content>.row>.col-xl-24 .row-description .category-description, .pageTypeproduct .site-main-content>.row>.col-xl-24 .row-description .category-headline {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

}

		  #apple-skin, #apple-skin * { box-sizing: border-box; }
		  #apple-skin {
			--g-0: #ffffff;
			--g-25: #fbfbfc;
			--g-50: #f6f7f8;
			--g-100:#f2f3f5;
			--g-150:#eef0f2;
			--g-200:#e7e9ec;
			--g-300:#d9dde2;
			--g-400:#c6ccd3;
			--g-500:#a8b0ba;
			--g-600:#7a8390;
			--g-700:#5a6370;
			--g-800:#3c4450;
			--text: #111315;
			--muted:#6b7280;
			--border:#e5e7eb;
			--shadow-1: 0 1px 2px rgba(0,0,0,.04), 0 6px 20px rgba(0,0,0,.06);
			--shadow-2: 0 10px 30px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.08);
			font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "SF Pro Text", "SF Pro Display", sans-serif;
			color: var(--text);
			background: var(--g-0); /* Hele baggrund uden for bokse er hvid */
			width: 100%;
			isolation: isolate;
		  }
		  /* Layout */
		  #apple-skin .container {
			width: 100%;
			max-width: 1600px;  /* Maks 1600 px */
			margin: 0 auto;
			padding: 0; /* bokse flugter med kanter i containeren */
		  }
		  #apple-skin .section { margin: 20px 0; } /* 20 px mellem sektioner og bokse */
		  /* Typografi */
		  #apple-skin h1, #apple-skin h2, #apple-skin h3, #apple-skin h4 {
			letter-spacing: .4px; /* Overskrifter: +0,4 */
			margin: 0;
			color: #0b0c0d;
		  }
		  #apple-skin h1 {
			font-size: clamp(36px, 6vw, 56px);
			line-height: 1.05;
			font-weight: 700;
			text-align: center;
		  }
		  #apple-skin .eyebrow {
			font-size: 22px;
			font-weight: 300;
			letter-spacing: .08em;
			text-transform: uppercase; /* uppercase hvis relevant */
			text-align: center;
			margin-top: 8px;
			color: var(--muted);
		  }
		  #apple-skin .lead {
			font-size: 15px;
			line-height: 1.6;
			text-align: center;
			margin-top: 8px;
			color: #33373d;
		  }
		  #apple-skin h2 {
			font-size: clamp(28px, 4vw, 36px);
			line-height: 1.15; /* stor h2, lav line-height */
			font-weight: 600;
		  }
		  #apple-skin h3 {
			font-size: clamp(20px, 2.8vw, 24px);
			line-height: 1.2;
			font-weight: 600;
			margin-bottom: .5em; /* halv linje efter H3 */
		  }
		  #apple-skin h4 {
			font-size: clamp(16px, 2.4vw, 18px);
			line-height: 1.15;
			font-weight: 600;
			text-transform: lowercase;      /* resten små bogstaver */
			margin-top: 1em;                /* linjeskift før H4 */
			margin-bottom: .4em;            /* en linjes mindre afstand til teksten */
		  }
		  #apple-skin h4::first-letter { text-transform: uppercase; } /* første bogstav stort */
		  #apple-skin p { margin: 0; color: #1f2329; }
		  #apple-skin ul { margin: 0; padding-left: 1.1rem!important; color:#27303a; }
		  #apple-skin .muted { color: var(--muted); }
		  /* Cards / Bokse */
		  #apple-skin .card {
			background: var(--g-50);
			border: 1px solid var(--border);
			border-radius: 16px;
			box-shadow: var(--shadow-1);              /* blid, lagdelt skygge */
			transition: box-shadow .35s ease, transform .25s ease;
			overflow: hidden;
            width: 100%;
		  }
		  #apple-skin .card:hover {
			box-shadow: var(--shadow-2);              /* løfter kort diskret ved hover */
			transform: translateY(-2px);
		  }
		  #apple-skin .card--plain { background: var(--g-0); }
		  #apple-skin .card__body { padding: 18px 18px 16px 18px!important; }
          
		  /* Placeholder må ikke have padding */
		  #apple-skin .card__body.placeholder { padding: 0; }
		  /* Grids (responsive) */
		  #apple-skin .grid-3 {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 20px;
			align-items: stretch;
		  }
		  #apple-skin .grid-3 .card { height: 100%; }
		  /* Info-banner før de tre bokse */
		  #apple-skin .info-banner-wrap { width: 100%; }
		  #apple-skin .info-banner {
			width: min(66%, 100%); /* 2/3 bredde som i kvalitetscheck; centrering */
			margin: 0 auto;
			background: var(--g-100);
			border: 1px solid var(--border);
			border-radius: 14px;
			box-shadow: var(--shadow-1);
			padding: 12px 16px!important;
			font-size: 14px;
			text-align: center;
		  }
		  #apple-skin .info-banner strong { font-weight: 600; color:#1f2937; }
		  #apple-skin .info-banner span   { color: #4b5563; }
		  /* Billeder: afrundede hjørner, diskrete skygger, lyse grå baggrunde */
		  #apple-skin .image-wrap {
			background: var(--g-100);
			border: 1px dashed var(--g-300);
			border-radius: 16px;
			box-shadow: var(--shadow-1);
			display: flex;
			align-items: center;
			justify-content: center;
			height: auto;
			overflow: hidden;
		  }
		  #apple-skin .image-wrap.placeholder { /* ingen padding for placeholder */ }
		  /* Udelad styling af img.responsive – vi styler alle andre */
		  #apple-skin img:not(.responsive) {
			max-width: 100%;
			height: auto;
			display: block;
			border-radius: 12px;
			background: var(--g-150);
			box-shadow: var(--shadow-1);
		  }
		  /* Sektion med 2-kolonne boks (span 2) efter ingredienser (Insi) */
		  #apple-skin .two-col-after-ingredients {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 20px;
		  }
		  #apple-skin .two-col-after-ingredients .span-2 { grid-column: span(2); }
		  /* Responsivitet */
  		  @media (max-width: 960px) {
			#apple-skin .grid-3,
			#apple-skin .two-col-after-ingredients { grid-template-columns: 1fr; }
			#apple-skin .two-col-after-ingredients .span-2 { grid-column: span 1; }
			#apple-skin .info-banner { width: 100%; }
		  }