@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&family=Cormorant+Garamond:ital,wght@1,500;1,600&display=swap');

/* RarePark Labs family: Viridia's forest workspace and RarePark's cinematic garden. */
:root{
  --deep:#09170e;
  --ink:#172518;
  --cream:#f6f2e9;
  --acid:#d6ff42;
  --moss:#385d3f;
  --brand-forest:#102219;
  --brand-rule:rgba(224,239,210,.23);
  --brand-muted:#c3d2b9;
  --brand-display:Manrope,'DM Sans',Arial,sans-serif;
  --brand-serif:'Cormorant Garamond','Playfair Display',Georgia,serif;
}
html{scroll-padding-top:80px}
body{background:var(--deep)}
::selection{background:var(--acid);color:var(--ink)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline-color:var(--acid)}

.site-header{position:sticky;top:0;z-index:30;height:80px;background:rgba(9,23,14,.96);border-bottom:1px solid var(--brand-rule);backdrop-filter:blur(18px)}
.identity-mark{width:48px;height:48px;border-color:rgba(246,242,233,.72)}
.identity-mark img{object-position:center;transform:none}
.identity-copy strong{font-family:var(--brand-display);font-size:23px;font-weight:800;letter-spacing:-.075em;line-height:1}
.identity-copy small{color:var(--acid);font-family:'DM Sans',Arial,sans-serif;font-weight:700;font-size:8px;letter-spacing:.16em}
.top-links a{color:#d2ddc9;font-size:12px;font-weight:700}
.top-links a:hover{color:var(--acid)}

.intro{position:relative;isolation:isolate;display:flex;align-items:center;max-width:none;min-height:clamp(650px,79vh,840px);padding:clamp(105px,12vh,160px) clamp(22px,5.2vw,90px) 115px;overflow:hidden;background:#102015}
.intro-copy{position:relative;z-index:2;max-width:980px}
.intro-art{position:absolute;inset:0;z-index:0;min-height:0;max-height:none;border:0;background:url('assets/viridia-garden-hedges.png') 26% 44%/cover no-repeat;pointer-events:none}
.intro-art img{display:block;width:68%;height:100%;margin-left:auto;object-fit:cover;object-position:center 45%;filter:saturate(1.05) contrast(1.03);mask-image:linear-gradient(90deg,transparent 0%,#000 34%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 34%)}
.intro-art:after{background:linear-gradient(90deg,rgba(7,23,14,.97) 0%,rgba(7,23,14,.88) 30%,rgba(7,23,14,.62) 55%,rgba(7,23,14,.12) 90%),linear-gradient(0deg,rgba(9,23,14,.92),transparent 28%,transparent 80%,rgba(9,23,14,.28))}
.art-label{left:auto;right:clamp(20px,5.2vw,90px);bottom:28px;background:none;color:var(--cream);border-top:1px solid var(--acid);padding:11px 0 0;font-size:10px;line-height:1.5;letter-spacing:.13em}
.intro .eyebrow{color:var(--acid);font:700 10px 'DM Sans',Arial,sans-serif;letter-spacing:.2em;margin-bottom:27px}
.intro-index{color:#c4d2b8}
.intro h1{max-width:940px;font-family:var(--brand-display);font-size:clamp(74px,8.2vw,138px);font-weight:800;line-height:.91;letter-spacing:-.095em;margin-bottom:37px}
.intro h1 em{font-family:var(--brand-serif);font-weight:500;letter-spacing:-.07em;color:var(--acid)}
.intro-lede{max-width:610px;color:#e5eddf;font-size:clamp(17px,1.4vw,20px);line-height:1.55}
.intro-cta{background:var(--acid);padding:17px 19px 17px 23px;font-weight:800}
.intro-cta:hover{background:#ebff9a}
.intro-note{color:#c7d5be;max-width:680px;line-height:1.7}

.catalog-shell{background:var(--deep);color:var(--cream);padding-top:clamp(55px,6vw,100px);padding-bottom:75px}
.catalog-head{margin-bottom:40px}
.catalog-head h2,.method h2{font-family:var(--brand-display);font-weight:800;letter-spacing:-.085em}
.catalog-head h2 em,.method h2 em{font-family:var(--brand-serif);font-weight:500;letter-spacing:-.06em;color:var(--acid)}
.catalog-head .eyebrow,.wrappers-heading .eyebrow.ink{color:var(--acid)}
.catalog-sub,.catalog-total{color:#bfceb6}
.medium-tabs{border-color:var(--brand-rule)}
.medium-tab{color:var(--cream);background:rgba(17,42,27,.56);border-color:var(--brand-rule);min-height:132px}
.medium-tab:first-child{border-left-color:var(--brand-rule)}
.medium-tab:hover{background:#1b3924}
.medium-tab[aria-selected="true"]{background:var(--acid);color:var(--ink)}
.tab-number{color:var(--acid);opacity:1;font-weight:700}
.medium-tab[aria-selected="true"] .tab-number{color:#34542a}
.tab-name{font-family:var(--brand-display);font-weight:800;letter-spacing:-.07em}
.tab-summary{color:#c2d0b9;opacity:1}
.medium-tab[aria-selected="true"] .tab-summary{color:#385334}
.catalog-invite{margin-top:24px;background:linear-gradient(90deg,#132b1dcf,#132b1dd9),url('assets/rarepark-sunbeam-flowers.png') right 45%/auto 390% no-repeat;border:1px solid var(--brand-rule);border-left:3px solid var(--acid);padding:24px 28px}
.catalog-invite span{color:var(--acid);font-weight:700}
.catalog-invite p{color:#e0ecd6}

/* Keep the dense research legible on a warm paper surface. */
.guide-bar{background:var(--cream);padding:24px 28px 0;margin:24px auto 0;gap:12px}
.work-area{background:var(--cream);color:var(--ink);padding:0 28px 28px}
.search-wrap input{background:#fffdf8}
.saved-toggle{background:#fffdf8}
.company-section{margin-bottom:34px}
.company-heading h4,.results-topline h3,.wrapper-card h4{font-family:var(--brand-display);font-weight:800}
.company-heading h4,.results-topline h3{letter-spacing:-.065em}
.model-title{font-family:var(--brand-display);font-weight:800}
.family-heading{background:#e9eedf}
.directory-more{background:var(--ink);border-color:var(--ink)}
.directory-more:hover{background:#345c39}

/* Wrappers stays a peer of the three media; the image is a banner within its view. */
.wrappers-shell{background:var(--cream);color:var(--ink);border-top:3px solid var(--acid)}
.wrappers-heading{position:relative;isolation:isolate;min-height:330px;align-items:center;overflow:hidden;padding:clamp(28px,4vw,57px);background:linear-gradient(90deg,rgba(8,24,14,.97) 0%,rgba(8,24,14,.87) 46%,rgba(8,24,14,.35) 100%),url('assets/rarepark-sunbeam-flowers.png') center 51%/cover no-repeat;color:var(--cream)}
.wrappers-heading h2,.wrapper-list-heading h3{font-family:var(--brand-display);font-weight:800}
.wrappers-heading h2 em{font-family:var(--brand-serif);font-weight:500;color:var(--acid)}
.wrappers-heading p:not(.eyebrow){color:#e3eedb}
.wrappers-count{color:#d6e6ce}
.compare-jump{background:var(--acid);color:var(--ink);font-weight:800}
.compare-jump:hover{background:#edffa2}
.wrappers-definition{border-color:rgba(23,37,24,.35)}
.wrapper-card{background:#fffcf5}
.wrapper-card h4{letter-spacing:-.07em}
.wrapper-list-heading h3 em{font-family:var(--brand-serif);font-weight:500}

.comparison-shell{background:#102219;border-top:1px solid var(--brand-rule)}
.compare-heading h2{font-family:var(--brand-display);font-weight:800;letter-spacing:-.075em}
.compare-heading h2 em{font-family:var(--brand-serif);font-weight:500}

.method{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(90deg,rgba(7,21,12,.97) 0%,rgba(7,21,12,.91) 53%,rgba(7,21,12,.52) 100%),url('assets/rarepark-megastructure-portal.png') center 47%/cover no-repeat;border-top:1px solid var(--brand-rule);min-height:450px}
.method-heading,.method-grid,.method-foot{position:relative;z-index:1}
.method h2{color:var(--cream)}
.method-grid article{border-color:var(--brand-rule)}
.method-grid{border-color:var(--brand-rule)}
.method-grid p,.method-foot{color:#d0dfc8}
.site-footer{background:#08150c;border-top:1px solid var(--brand-rule)}
.site-footer>span{font-family:var(--brand-display);font-weight:800;letter-spacing:-.06em}
.site-footer small{font-family:'DM Sans',Arial,sans-serif;color:var(--acid);letter-spacing:.15em;font-weight:700}
.site-footer a:hover{color:var(--acid)}
.dialog-inner h2{font-family:var(--brand-display);font-weight:800}

@media(max-width:1000px){
  .intro{min-height:660px}
  .intro h1{font-size:clamp(68px,9.2vw,105px)}
  .intro-art img{width:75%}
  .wrappers-heading{min-height:290px}
}
@media(max-width:720px){
  html{scroll-padding-top:72px}
  .site-header{height:72px;padding:0 18px}
  .identity-mark{width:40px;height:40px}
  .identity-copy strong{font-size:20px}
  .identity-copy small{font-size:7px}
  .intro{min-height:660px;padding:95px 20px 100px;align-items:center}
  .intro-art{height:100%;background-position:29% 40%}
  .intro-art img{width:100%;mask-image:none;-webkit-mask-image:none;opacity:.62;object-position:50% 39%}
  .intro-art:after{background:linear-gradient(90deg,rgba(7,23,14,.92),rgba(7,23,14,.64)),linear-gradient(0deg,rgba(7,23,14,.86),transparent 35%)}
  .intro h1{font-size:clamp(59px,12vw,83px);line-height:.94;margin-bottom:24px}
  .intro-lede{font-size:16px}
  .intro-note{font-size:10px}
  .art-label{display:none}
  .catalog-shell{padding:54px 18px 62px}
  .medium-tab{min-height:96px}
  .medium-tab:nth-child(3){border-left-color:var(--brand-rule)}
  .catalog-invite{padding:18px 20px;background-size:auto 300%}
  .guide-bar{padding:18px 16px 0}
  .work-area{padding:0 16px 22px}
  .wrappers-shell{padding:18px}
  .wrappers-heading{min-height:0;padding:31px 24px;display:block;background-position:64% 50%}
  .wrappers-heading h2{font-size:42px}
  .wrappers-count{color:#d4e2cb}
  .method{background-position:58% 50%}
}
