/* ==========================================================================
   Raimont theme — design tokens + components from the redesign mockups
   Loads AFTER bootstrap.min.css, BEFORE style.css
   ========================================================================== */

:root{
  --rm-ink:#121416;
  --rm-paper:#f4f0e8;
  --rm-paper2:#e9e2d7;
  --rm-blue:#173f5d;
  --rm-blue2:#255f83;
  --rm-dark:#17191b;
  --rm-darker:#111315;
  --rm-muted:#686b6e;
  --rm-line:rgba(0,0,0,.12);
  --rm-gold:#af791c;
  --rm-serif:Georgia,"Times New Roman",serif;

  /* Bootstrap overrides */
  --bs-primary:#173f5d;
  --bs-primary-rgb:23,63,93;
  --bs-body-bg:#f4f0e8;
  --bs-body-color:#121416;
  --bs-body-font-family:Arial,Helvetica,sans-serif;
  --bs-body-line-height:1.5;
  --bs-border-radius:0;
  --bs-border-radius-sm:0;
  --bs-border-radius-lg:0;
  --bs-link-color:#173f5d;
  --bs-link-hover-color:#255f83;
}

body{background:var(--rm-paper);color:var(--rm-ink);font-family:Arial,Helvetica,sans-serif}
img{max-width:100%}

/* ---------- Buttons ------------------------------------------------------ */
.btn{border-radius:0;font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;padding:13px 20px}
.btn-primary{--bs-btn-bg:var(--rm-blue);--bs-btn-border-color:var(--rm-blue);
  --bs-btn-hover-bg:var(--rm-blue2);--bs-btn-hover-border-color:var(--rm-blue2);
  --bs-btn-active-bg:var(--rm-blue2);--bs-btn-active-border-color:var(--rm-blue2)}
.btn-outline-light{--bs-btn-border-color:rgba(255,255,255,.72);--bs-btn-hover-bg:#fff;--bs-btn-hover-color:#111}
.btn-sm{padding:10px 14px;font-size:.62rem}
.btn-lg{padding:15px 26px;font-size:.78rem}
.bg-primary{background-color:var(--rm-blue)!important}

/* ---------- Typography helpers ------------------------------------------ */
.rm-serif{font-family:var(--rm-serif)}
.rm-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.18em;font-weight:800;display:block}
.rm-textlink{font-size:.7rem;text-transform:uppercase;letter-spacing:.11em;font-weight:800;color:var(--rm-blue);text-decoration:none}
.rm-textlink:hover{color:var(--rm-blue2)}
.rm-section{padding:66px 0}
.rm-section h2,.rm-section-head h2{font-family:var(--rm-serif);font-size:2.7rem;line-height:1;margin:5px 0 0}
.rm-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:27px}
.rm-stars{color:var(--rm-gold);font-size:.82rem}

/* ---------- Top bar / header -------------------------------------------- */
.rm-topbar{background:var(--rm-blue);color:#fff;font-size:.71rem;letter-spacing:.08em;text-transform:uppercase}
.rm-topbar .container-fluid{min-height:34px;display:flex;align-items:center;justify-content:space-between}
.rm-topbar a{color:#fff;text-decoration:none}
.rm-topbar a:hover{color:#cfe0ec}
.rm-toplinks{display:flex;gap:18px}

.navbar.rm-nav{background:var(--rm-darker)!important;border-bottom:1px solid rgba(255,255,255,.15);padding:0 1rem}
.rm-nav .navbar-brand{min-height:72px;display:flex;align-items:center}
.rm-nav .navbar-nav .nav-link{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:#fff}
.rm-nav .navbar-nav .nav-link:hover{color:#9bb3c5}
.rm-nav .dropdown-menu{border-radius:0}

/* ---------- Hero --------------------------------------------------------- */
.rm-hero{background:#0f1113;color:#fff;min-height:555px;position:relative;overflow:hidden;display:flex;align-items:center}
.rm-hero-photo{position:absolute;right:0;top:0;width:57%;height:100%;overflow:hidden}
.rm-hero-photo img{height:100%;width:178%;max-width:none;object-fit:cover;object-position:left center;
  filter:saturate(.65) brightness(.66) contrast(1.08)}
.rm-hero:after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#0e1012 0%,rgba(14,16,18,.98) 28%,rgba(14,16,18,.79) 54%,rgba(14,16,18,.15) 100%)}
.rm-hero>.container{position:relative;z-index:2}
.rm-hero-copy{width:66%;padding:55px 0}
.rm-hero h1{font-size:clamp(3.3rem,6vw,5.8rem);line-height:.91;text-transform:uppercase;letter-spacing:-.045em;margin:8px 0 22px;font-weight:700}
.rm-hero h1 span{color:#9bb3c5}
.rm-hero p{max-width:560px;font-family:var(--rm-serif);font-size:1.15rem;color:#e7e2d9;margin-bottom:28px}
.rm-handnote{position:absolute;right:1rem;top:31%;z-index:2;font-family:var(--rm-serif);font-style:italic;
  font-size:1.45rem;line-height:1.2;text-align:center;transform:rotate(-4deg);color:#fff}
.rm-handnote:after{content:"";display:block;width:55px;border-bottom:2px solid #fff;margin:15px auto}

/* ---------- Category tiles ---------------------------------------------- */
.rm-cat-card{background:#fff;border:1px solid rgba(0,0,0,.1);overflow:hidden;display:block;
  color:inherit;text-decoration:none;height:100%}
.rm-cat-image{aspect-ratio:1/1;overflow:hidden;background:#e8e3dc;display:flex;align-items:center;justify-content:center;padding:22px}
.rm-cat-image img{width:100%;height:100%;object-fit:contain;transition:transform .35s}
.rm-cat-card:hover .rm-cat-image img{transform:scale(1.035)}
.rm-cat-body{padding:15px}
.rm-cat-body strong{font-family:var(--rm-serif);font-size:1.1rem;text-transform:uppercase;display:block}
.rm-cat-body span{font-size:.78rem;color:#555}

/* ---------- Product tiles ------------------------------------------------ */
.rm-products{background:#fbfaf7}
.rm-product{text-align:center;height:100%;display:flex;flex-direction:column}
.rm-product-photo{aspect-ratio:1/1;background:#f0ede7;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden}
.rm-product-photo img{width:100%;height:100%;object-fit:contain}
.rm-product h3{font-family:var(--rm-serif);font-size:1rem;margin:10px 0 2px}
.rm-price{font-size:.9rem;font-weight:800}
.rm-was{color:#888;text-decoration:line-through;font-weight:400;margin-left:5px}
.rm-product .btn{margin-top:auto}

.rm-brand-card{min-height:100%;color:#fff;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;
  background-color:#17191b;background-size:cover;background-position:center;background-repeat:no-repeat}
.rm-brand-card h3{font-size:2.2rem;line-height:.95;text-transform:uppercase;margin:8px 0 15px;font-weight:700}
.rm-brand-card p{font-family:var(--rm-serif);color:#e9e3da}
.rm-brand-card .btn{width:max-content}

/* ---------- Routine band ------------------------------------------------- */
.rm-routine{background:var(--rm-dark);color:#fff;padding:50px 0}
.rm-routine h2{font-family:var(--rm-serif);font-size:2.1rem;margin:4px 0}
.rm-step{border-left:1px solid rgba(255,255,255,.18);padding-left:22px;height:100%}
.rm-step .rm-num{font-size:1.6rem;color:#9bb7cb;font-weight:900}
.rm-step strong{font-family:var(--rm-serif);font-size:1.25rem;text-transform:uppercase;display:block}
.rm-step p{color:#c9c9c9;margin:4px 0}

/* ---------- Split feature ------------------------------------------------ */
.rm-feature{display:grid;grid-template-columns:1fr 1fr;min-height:430px}
.rm-feature-photo{overflow:hidden;background:#222}
.rm-feature-photo img{width:100%;height:100%;object-fit:cover}
.rm-feature-copy{background:#dfd4c2;padding:60px;display:flex;flex-direction:column;justify-content:center}
.rm-feature-copy h2{font-family:var(--rm-serif);font-size:3rem;line-height:1;margin:7px 0 18px}
.rm-feature-copy p{font-family:var(--rm-serif);font-size:1.08rem;max-width:520px}
.rm-feature-copy .btn{width:max-content}

/* ---------- Trust bar ---------------------------------------------------- */
.rm-trust{background:var(--rm-blue);color:#fff}
.rm-trust-item{padding:26px 20px;border-right:1px solid rgba(255,255,255,.17);display:flex;align-items:center;gap:12px}
.rm-trust-item:last-child{border-right:0}
.rm-trust-icon{font-size:1.7rem;line-height:1}
.rm-trust strong{display:block;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem}
.rm-trust span{font-size:.73rem;color:#d6e0e8}

/* ---------- Journal / newsletter ----------------------------------------- */
.rm-article{display:block;color:inherit;text-decoration:none}
.rm-article-photo{aspect-ratio:16/8;overflow:hidden;background:#222}
.rm-article-photo img{width:100%;height:100%;object-fit:cover}
.rm-article h3{font-family:var(--rm-serif);margin:9px 0 2px;font-size:1.05rem}
.rm-article p{font-size:.84rem;color:#555;margin:0}
.rm-newsletter{background:var(--rm-blue);color:#fff;padding:27px;height:100%}
.rm-newsletter h3{font-family:var(--rm-serif);font-size:1.8rem;margin:5px 0}
.rm-newsletter p{font-size:.88rem;color:#dce5eb}
.rm-newsletter .form-control{border:0;border-radius:0}

/* ---------- Footer ------------------------------------------------------- */
footer.rm-footer{background:#151719;color:#eee9e1;padding:52px 0 27px}
.rm-footer-logo{font-family:var(--rm-serif);font-size:2rem;letter-spacing:.08em;font-weight:800;color:#fff;text-decoration:none;display:inline-block}
.rm-footer p{font-family:var(--rm-serif);color:#c8c6c1}
.rm-footer h4,.rm-footer h5,.rm-footer h6{text-transform:uppercase;letter-spacing:.11em;font-size:.7rem;margin:0 0 10px;font-weight:800}
.rm-footer a.rm-flink{display:block;font-family:var(--rm-serif);color:#c8c6c1;font-size:.87rem;margin:5px 0;text-decoration:none}
.rm-footer a.rm-flink:hover{color:#fff}
.rm-footer .form-control{border:0;border-radius:0}
.rm-copy{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:20px;font-size:.75rem;color:#aaa;
  display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}

/* ---------- Accessibility ------------------------------------------------ */
a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:2px solid var(--rm-blue2);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  .rm-cat-card:hover .rm-cat-image img{transform:none}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ---------- Responsive --------------------------------------------------- */
@media(max-width:991.98px){
  .rm-hero-copy{width:76%}
  .rm-handnote{display:none}
  .rm-step{border-left:0;border-top:1px solid rgba(255,255,255,.15);padding:16px 0 0}
}
@media(max-width:767.98px){
  .rm-hero,.rm-hero>.container{min-height:520px}
  .rm-hero-photo{width:80%;right:-30%}
  .rm-hero-copy{width:100%}
  .rm-hero h1{font-size:3.35rem}
  .rm-section{padding:46px 0}
  .rm-section-head{align-items:flex-start;flex-direction:column}
  .rm-section h2,.rm-section-head h2{font-size:2.15rem}
  .rm-feature{grid-template-columns:1fr}
  .rm-feature-photo{min-height:330px}
  .rm-feature-copy{padding:42px 28px}
  .rm-feature-copy h2{font-size:2.4rem}
  .rm-trust-item{border-right:0;border-bottom:1px solid rgba(255,255,255,.17)}
  .rm-copy{flex-direction:column}
}
