/**
 * File: /common/css/product.css
 * Package: MICROBA OUTLOOK
 * Component: canonical /product/ landing page
 * Version: 2.0.59
 * Patch: PRODUCT-V5-CERTIFICATE-HERO-1.0.0
 * Release Date: 2026-08-18
 */
.microba-product-landing{
    background: var(--microba-canvas, #020806);
  --mpl-bg:var(--microba-canvas,#020806);--mpl-bg2:var(--microba-canvas-alt,#040907);--mpl-paper:#f1ebde;--mpl-ink:#18150f;
  --mpl-gold:#d2a345;--mpl-gold2:#f0c76e;--mpl-cream:#f4eee1;--mpl-muted:#b4ac9e;
  --mpl-line:rgba(210,163,69,.28);color:var(--mpl-cream);overflow:clip
}
.microba-product-landing *,.microba-product-landing *::before,.microba-product-landing *::after{box-sizing:border-box}
.microba-product-landing img{display:block;max-width:100%}
.microba-product-landing a{color:inherit}
.microba-product-landing .microba-eyebrow{color:var(--mpl-gold2)}
.microba-product-landing h1,.microba-product-landing h2,.microba-product-landing h3{font-family:var(--microba-font-display,Georgia,serif);font-weight:400}
.microba-product-landing h2{margin:.45rem 0 1rem;font-size:clamp(2.5rem,4.7vw,4.9rem);line-height:.98;letter-spacing:-.025em}
.microba-product-landing h2 span{color:var(--mpl-gold2)}
.mpl-cta{display:inline-flex;align-items:center;gap:22px;min-height:54px;padding:0 24px;border:1px solid rgba(240,199,110,.75);background:linear-gradient(180deg,#ecc767,#c89336);color:#171107!important;font-size:.78rem;font-weight:700;letter-spacing:.055em;text-decoration:none;transition:transform .2s ease,filter .2s ease}
.mpl-cta:hover{transform:translateY(-1px);filter:brightness(1.05)}
.mpl-text-link{display:inline-flex;gap:12px;align-items:center;color:var(--mpl-gold2);font-size:.76rem;font-weight:700;letter-spacing:.075em;text-decoration:none}

/* Hero */
.mpl-hero{position:relative;min-height:min(880px,94svh);display:grid;align-items:center;overflow:hidden;background:radial-gradient(circle at 78% 48%,rgba(210,163,69,.10),transparent 34%),#000}
.mpl-hero__image{position:absolute;z-index:1;top:50%;right:clamp(24px,4vw,78px);left:auto;width:min(45vw,650px);height:min(82%,760px);transform:translateY(-50%);object-fit:contain;object-position:center center;filter:drop-shadow(0 30px 70px rgba(0,0,0,.55))}
.mpl-hero__scrim{position:absolute;z-index:0;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.98) 0%,rgba(0,0,0,.94) 35%,rgba(0,0,0,.68) 51%,rgba(0,0,0,.16) 67%,rgba(0,0,0,.02) 100%)}
.mpl-hero__inner{position:relative;z-index:2;padding-top:calc(var(--microba-header-height,92px) + 92px);padding-bottom:88px}
.mpl-hero__copy{max-width:min(650px,48vw)}
.mpl-hero h1{margin:.65rem 0 1.15rem;font-size:clamp(4.2rem,8vw,8.3rem);line-height:.82;letter-spacing:-.045em}
.mpl-hero h1 span{color:var(--mpl-gold2);font-size:.82em}
.mpl-hero__statement{max-width:620px;margin:0 0 1.1rem;color:#f6dfaa;font-family:var(--microba-font-display,Georgia,serif);font-size:clamp(1.9rem,3vw,3.25rem);line-height:1.08}
.mpl-hero__lead{max-width:61ch;margin:0 0 2rem;color:rgba(244,238,225,.86);font-size:clamp(1rem,1.3vw,1.2rem);line-height:1.72}
.mpl-hero__lead strong{color:#fff0c8;font-weight:500}
.mpl-hero__note{max-width:58ch;margin:1.25rem 0 0;color:#a89e8e;font-size:.83rem;line-height:1.55}

/* Shared headings */
.mpl-section-heading{max-width:900px;margin-bottom:48px}
.mpl-section-heading>p:last-child{max-width:760px;margin:0;color:#686158;font-size:1.06rem;line-height:1.72}
.mpl-section-heading--center{text-align:center;margin-inline:auto}.mpl-section-heading--center>p:last-child{margin-inline:auto}

/* Definition */
.mpl-definition{padding:100px 0 110px;background:var(--mpl-paper);color:var(--mpl-ink)}
.mpl-definition .microba-eyebrow{color:#8a611d}
.mpl-principles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-block:1px solid rgba(117,81,23,.26)}
.mpl-principle{min-height:270px;padding:34px 28px}.mpl-principle+.mpl-principle{border-left:1px solid rgba(117,81,23,.22)}
.mpl-principle__mark{display:block;margin-bottom:30px;color:#9b6b1b;font-size:1.8rem}
.mpl-principle h3{margin:0 0 12px;color:#765017;font-size:1.05rem;letter-spacing:.035em}
.mpl-principle p{margin:0;color:#5f584e;line-height:1.7}

/* Preparation */
.mpl-preparation{background:radial-gradient(circle at 50% 0, var(--microba-canvas-gold-glow, rgba(209,162,70,.055)), transparent 30%), var(--microba-canvas, #020806);padding:108px 0;}
.mpl-preparation__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(48px,7vw,110px);align-items:center}
.mpl-preparation__media{margin:0;overflow:hidden;border:1px solid var(--mpl-line);border-radius:16px;background:#080b08;box-shadow:0 30px 90px rgba(0,0,0,.28)}
.mpl-preparation__media img{width:100%;aspect-ratio:4/3;object-fit:cover}
.mpl-preparation__copy>p:not(.microba-eyebrow):not(.mpl-small-note){max-width:620px;color:#b9b0a2;line-height:1.75}
.mpl-recipe{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:30px 0;border-block:1px solid var(--mpl-line)}
.mpl-recipe>div{padding:25px 20px}.mpl-recipe>div:nth-child(even){border-left:1px solid var(--mpl-line)}.mpl-recipe>div:nth-child(n+3){border-top:1px solid var(--mpl-line)}
.mpl-recipe strong{display:block;color:var(--mpl-gold2);font-family:var(--microba-font-display,Georgia,serif);font-size:2rem;font-weight:400}
.mpl-recipe span{display:block;margin-top:5px;color:#b9b0a2;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}
.mpl-small-note{margin:0 0 25px;color:#8f877b;font-size:.82rem;line-height:1.62}

/* Journey */
.mpl-journey{padding:106px 0 116px;background:#f2ede4;color:var(--mpl-ink)}
.mpl-journey .microba-eyebrow{color:#8a611d}.mpl-journey .mpl-section-heading>p:last-child{color:#625b51}
.mpl-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid rgba(117,81,23,.28)}
.mpl-step{position:relative;min-height:270px;padding:32px 22px 28px}.mpl-step+.mpl-step{border-left:1px solid rgba(117,81,23,.18)}
.mpl-step__number{display:inline-grid;place-items:center;width:38px;height:38px;margin-bottom:28px;border:1px solid rgba(118,79,21,.4);border-radius:50%;color:#765017;font-size:.73rem}
.mpl-step h3{margin:0 0 10px;font-size:1.45rem;line-height:1.12}.mpl-step p{margin:0;color:#625b52;font-size:.91rem;line-height:1.62}

/* Certificate */
.mpl-certificate{background:var(--microba-canvas-alt, #040907);padding:112px 0;}
.mpl-certificate__grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(48px,7vw,110px);align-items:center}
.mpl-certificate__copy>p:not(.microba-eyebrow){color:#b8afa0;line-height:1.75}
.mpl-certificate__facts{margin:28px 0 30px;padding:22px 0;border-block:1px solid var(--mpl-line)}
.mpl-certificate__facts p{margin:.55rem 0;color:#a9a093!important;font-size:.92rem;line-height:1.55!important}.mpl-certificate__facts strong{color:#ead4a4;font-weight:500}
.mpl-certificate__media{margin:0}.mpl-certificate__media img{width:100%;max-height:790px;object-fit:contain;filter:drop-shadow(0 28px 60px rgba(0,0,0,.4))}.mpl-certificate__media figcaption{max-width:640px;margin:14px auto 0;color:#7f786e;font-size:.73rem;line-height:1.55;text-align:center}

/* Closing */
.mpl-closing{background:radial-gradient(circle at 50% 0, var(--microba-canvas-gold-glow, rgba(209,162,70,.055)), transparent 30%), var(--microba-canvas, #020806);border-top:1px solid var(--mpl-line);}
.mpl-closing__inner{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center;padding-top:76px;padding-bottom:76px}
.mpl-closing h2{font-size:clamp(2.7rem,4.5vw,4.8rem)}.mpl-closing p:not(.microba-eyebrow){max-width:720px;margin:0;color:#a9a093;line-height:1.7}

@media(max-width:1120px){
  .mpl-principles{grid-template-columns:repeat(2,minmax(0,1fr))}.mpl-principle:nth-child(3){border-left:0;border-top:1px solid rgba(117,81,23,.22)}.mpl-principle:nth-child(4){border-top:1px solid rgba(117,81,23,.22)}
  .mpl-steps{grid-template-columns:repeat(3,minmax(0,1fr))}.mpl-step:nth-child(4){border-left:0;border-top:1px solid rgba(117,81,23,.18)}.mpl-step:nth-child(5),.mpl-step:nth-child(6){border-top:1px solid rgba(117,81,23,.18)}
}
@media(max-width:820px){
  .mpl-hero{min-height:0;display:flex;flex-direction:column;align-items:stretch;padding-bottom:44px}.mpl-hero__image{position:relative;z-index:1;order:2;top:auto;right:auto;width:min(78vw,500px);height:auto;max-height:none;margin:12px auto 0;transform:none;object-position:center}.mpl-hero__scrim{background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.42) 50%,rgba(0,0,0,.92) 100%)}.mpl-hero__inner{order:1;padding-top:calc(var(--microba-header-height,92px) + 56px);padding-bottom:26px}.mpl-hero__copy{max-width:100%}
  .mpl-preparation__grid,.mpl-certificate__grid{grid-template-columns:1fr;gap:44px}.mpl-preparation__media{order:2}
  .mpl-closing__inner{grid-template-columns:1fr;gap:28px}
}
@media(max-width:620px){
  .mpl-definition,.mpl-preparation,.mpl-journey,.mpl-certificate{padding:74px 0}
  .mpl-hero h1{font-size:clamp(3.5rem,18vw,5.6rem)}
  .mpl-principles{grid-template-columns:1fr}.mpl-principle+.mpl-principle{border-left:0;border-top:1px solid rgba(117,81,23,.22)}
  .mpl-recipe{grid-template-columns:1fr}.mpl-recipe>div:nth-child(even){border-left:0}.mpl-recipe>div+div{border-top:1px solid var(--mpl-line)}
  .mpl-steps{grid-template-columns:1fr 1fr}.mpl-step:nth-child(n){border-left:0;border-top:1px solid rgba(117,81,23,.18)}.mpl-step:nth-child(odd){border-right:1px solid rgba(117,81,23,.18)}
  .mpl-cta{width:100%;justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){.microba-product-landing *{transition:none!important}}
