:root{
  --oma-portti-cream:#f6f2e8;
  --oma-portti-cream2:#fbf8f0;
  --oma-portti-ink:#263326;
  --oma-portti-green:#355637;
  --oma-portti-muted:#6e776c;
  --oma-portti-line:#d8d1c3;
}
html{scroll-behavior:smooth}
.oma-portti{
  width:100%;
  max-width:none;
  margin:0;
  color:var(--oma-portti-ink);
  background:var(--oma-portti-cream2);
  font-family:Georgia,"Times New Roman",serif;
  line-height:1.65;
}
.oma-portti *{box-sizing:border-box}
.oma-portti a{color:inherit}
.oma-portti-hero{
  position:relative;
  min-height:82vh;
  display:flex;
  align-items:center;
  overflow:hidden;
  background-image:url("portti-hero.png");
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.oma-portti-hero__veil{
  position:absolute;
  inset:0;
  background:linear-gradient(
    90deg,
    rgba(246,242,232,.98) 0%,
    rgba(246,242,232,.94) 34%,
    rgba(246,242,232,.34) 58%,
    rgba(246,242,232,0) 76%
  );
}
.oma-portti-hero__content{
  position:relative;
  z-index:2;
  width:min(690px,92%);
  padding:8vh 4vw 9vh 6vw;
}
.oma-portti-hero h1{
  margin:0;
  font-size:clamp(4rem,7vw,7.4rem);
  line-height:.9;
  font-weight:400;
  letter-spacing:.02em;
}
.oma-portti-hero__lead{
  margin:22px 0 24px;
  font-size:clamp(1.4rem,2.2vw,2.25rem);
  font-style:italic;
  color:var(--oma-portti-green);
}
.oma-portti-rule{
  display:flex;
  align-items:center;
  gap:16px;
  width:220px;
  margin:22px 0 30px;
  color:var(--oma-portti-green);
}
.oma-portti-rule:before{
  content:"";
  height:1px;
  flex:1;
  background:var(--oma-portti-green);
  opacity:.45;
}
.oma-portti-hero__content p{
  max-width:560px;
  margin:0 0 20px;
  font-size:1.15rem;
}
.oma-portti-button{
  display:inline-flex;
  align-items:center;
  gap:42px;
  margin-top:8px;
  padding:17px 26px;
  border-radius:8px;
  background:var(--oma-portti-green);
  color:#fff!important;
  text-decoration:none!important;
  letter-spacing:.1em;
  font-size:1rem;
  transition:transform .2s ease,filter .2s ease;
}
.oma-portti-button:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
}
.oma-portti-welcome{
  margin-top:22px!important;
  color:var(--oma-portti-green);
}
.oma-portti-section{
  padding:92px 6vw;
  max-width:1500px;
  margin:0 auto;
}
.oma-portti-section h2,
.oma-portti-pause h2,
.oma-portti-final h2{
  font-size:clamp(2.2rem,4vw,4rem);
  font-weight:400;
  line-height:1.1;
}
.oma-portti-section h2{text-align:center;margin:0 0 14px}
.oma-portti-intro{
  max-width:760px;
  margin:0 auto 46px;
  text-align:center;
  color:var(--oma-portti-muted);
  font-size:1.15rem;
}
.oma-portti-cards{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
}
.oma-portti-card{
  display:flex;
  min-height:300px;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:32px 22px 26px;
  border:1px solid var(--oma-portti-line);
  border-radius:12px;
  background:rgba(255,255,255,.32);
  text-decoration:none!important;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.oma-portti-card:hover{
  transform:translateY(-3px);
  background:#fffdf8;
  box-shadow:0 14px 34px rgba(50,60,45,.08);
}
.oma-portti-card__icon{
  width:76px;
  height:76px;
  border-radius:50%;
  display:grid;
  place-items:center;
  margin-bottom:18px;
  background:#e8eadf;
  font-size:2rem;
}
.oma-portti-card h3{
  margin:0 0 12px;
  font-weight:400;
  letter-spacing:.06em;
}
.oma-portti-card p{margin:0;color:var(--oma-portti-muted)}
.oma-portti-card__arrow{margin-top:auto;padding-top:18px;font-size:1.3rem}
.oma-portti-pause{
  padding:90px 6vw;
  background:var(--oma-portti-cream);
  text-align:center;
}
.oma-portti-pause>div{max-width:800px;margin:auto}
.oma-portti-pause h2{margin:0 0 22px}
.oma-portti-pause p{font-size:1.2rem}
.oma-portti-story{
  max-width:840px;
  margin:0 auto;
  padding:100px 6vw;
}
.oma-portti-story h2{
  margin:0 0 24px;
  font-size:clamp(2.3rem,4vw,3.8rem);
  font-weight:400;
  line-height:1.1;
}
.oma-portti-story p{font-size:1.2rem}
.oma-portti-final{
  padding:96px 6vw 110px;
  background:var(--oma-portti-ink);
  color:#f8f3e7;
  text-align:center;
}
.oma-portti-final h2{margin:0 0 18px}
.oma-portti-final>p{
  max-width:760px;
  margin:0 auto 32px;
  font-size:1.15rem;
}
.oma-portti-final__links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px;
}
.oma-portti-final__links a{
  padding:10px 18px;
  border:1px solid rgba(255,255,255,.35);
  border-radius:999px;
  text-decoration:none!important;
}
.oma-portti-final__links a:hover{background:rgba(255,255,255,.08)}
.oma-portti-final__quiet{margin-top:42px!important}

@media (max-width:1050px){
  .oma-portti-hero__veil{
    background:linear-gradient(
      90deg,
      rgba(246,242,232,.98) 0%,
      rgba(246,242,232,.90) 54%,
      rgba(246,242,232,.20) 100%
    );
  }
  .oma-portti-cards{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .oma-portti-hero{
    min-height:86vh;
    background-position:63% center;
  }
  .oma-portti-hero__veil{
    background:linear-gradient(
      180deg,
      rgba(246,242,232,.97) 0%,
      rgba(246,242,232,.90) 58%,
      rgba(246,242,232,.18) 100%
    );
  }
  .oma-portti-hero__content{padding:8vh 7vw 18vh}
  .oma-portti-hero h1{font-size:4rem}
  .oma-portti-hero__lead{font-size:1.5rem}
  .oma-portti-hero__content p{font-size:1.02rem}
  .oma-portti-cards{grid-template-columns:1fr}
  .oma-portti-section,
  .oma-portti-pause,
  .oma-portti-story,
  .oma-portti-final{
    padding-left:7vw;
    padding-right:7vw;
  }
}


/* Portti 1.1: hide the theme's old page hero/title only on /portti/.
   Multiple common selectors are included so this works across typical WP themes.
   The global header/site navigation is intentionally untouched. */
.oma-portti-page .page-header,
.oma-portti-page .entry-header,
.oma-portti-page .page-title-area,
.oma-portti-page .page-title-section,
.oma-portti-page .page-hero,
.oma-portti-page .hero-banner,
.oma-portti-page .featured-image-header,
.oma-portti-page .wp-block-cover:first-child:has(+ .entry-content),
.oma-portti-page main > .wp-block-cover:first-child {
  display:none !important;
}

/* Remove theme spacing around the plugin's replacement content. */
.oma-portti-page .entry-content,
.oma-portti-page .site-main,
.oma-portti-page main {
  margin-top:0;
}
.oma-portti-page .entry-content > .oma-portti {
  margin-top:0;
}

/* Front-page Portti invitation */
.oma-portti-invitation{
  width:100%;
  padding:76px 6vw;
  background:#f6f2e8;
  color:#263326;
  font-family:Georgia,"Times New Roman",serif;
  text-align:center;
}
.oma-portti-invitation__inner{
  max-width:760px;
  margin:0 auto;
}
.oma-portti-invitation__mark{
  color:#355637;
  font-size:1.5rem;
  margin-bottom:10px;
}
.oma-portti-invitation__eyebrow{
  margin:0 0 12px !important;
  color:#6e776c;
  font-size:.82rem !important;
  font-weight:600;
  letter-spacing:.16em;
}
.oma-portti-invitation h2{
  margin:0 0 16px;
  color:#355637;
  font-size:clamp(2.2rem,4vw,3.7rem);
  font-weight:400;
  line-height:1.1;
}
.oma-portti-invitation p{
  max-width:650px;
  margin:0 auto 24px;
  font-size:1.12rem;
  line-height:1.7;
}
.oma-portti-invitation a{
  display:inline-flex;
  align-items:center;
  gap:18px;
  padding:13px 21px;
  border:1px solid #355637;
  border-radius:999px;
  color:#355637 !important;
  text-decoration:none !important;
  transition:.2s ease;
}
.oma-portti-invitation a:hover{
  background:#355637;
  color:#fff !important;
}


/* Portti 1.2 — OMA Seasons theme exact selector.
   The old theme-generated dock hero is:
   <section class="oma-hero ... oma-page-hero ...">
   Hide exactly that page hero on Portti, while keeping .site-header intact. */
body.oma-portti-page > section.oma-hero.oma-page-hero,
body.oma-portti-page section.oma-hero.oma-page-hero {
    display: none !important;
}

/* The theme wraps page content in content-section/content-wrap.
   Let Portti use the full viewport width instead of inheriting article limits. */
body.oma-portti-page > section.content-section {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
body.oma-portti-page section.content-section > article.content-wrap {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Portti 1.3 — front-page invitation refinement */
.oma-portti-invitation{
  position:relative;
  overflow:hidden;
}
.oma-portti-invitation:before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  width:min(180px,28vw);
  height:1px;
  transform:translateX(-50%);
  background:rgba(53,86,55,.28);
}
.oma-portti-invitation__inner{
  position:relative;
  z-index:1;
}
@media (max-width:640px){
  .oma-portti-invitation{
    padding-top:58px;
    padding-bottom:62px;
  }
}