/* ONEPLACES — Design tokens
   Canonical source extracted from assets/css/oneplaces.css :root block. */

/* ===== Satoshi (variable + static) ===== */
@font-face{
  font-family:'Satoshi';
  src:url('fonts/Satoshi-Variable.woff2') format('woff2-variations'),
      url('fonts/Satoshi-Variable.woff2') format('woff2');
  font-weight:300 900;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'Satoshi';
  src:url('fonts/Satoshi-VariableItalic.woff2') format('woff2-variations'),
      url('fonts/Satoshi-VariableItalic.woff2') format('woff2');
  font-weight:300 900;font-style:italic;font-display:swap;
}
/* static fallbacks for browsers without variable support */
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-LightItalic.woff2') format('woff2');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-MediumItalic.woff2') format('woff2');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-BoldItalic.woff2') format('woff2');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-Black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Satoshi';src:url('fonts/Satoshi-BlackItalic.woff2') format('woff2');font-weight:900;font-style:italic;font-display:swap}

/* ===== Montserrat ===== */
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Thin.ttf') format('truetype');font-weight:100;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-ThinItalic.ttf') format('truetype');font-weight:100;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-ExtraLight.ttf') format('truetype');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-ExtraLightItalic.ttf') format('truetype');font-weight:200;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Light.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-LightItalic.ttf') format('truetype');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-MediumItalic.ttf') format('truetype');font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-SemiBold.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-SemiBoldItalic.ttf') format('truetype');font-weight:600;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-BoldItalic.ttf') format('truetype');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-ExtraBold.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-ExtraBoldItalic.ttf') format('truetype');font-weight:800;font-style:italic;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-Black.ttf') format('truetype');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('fonts/Montserrat-BlackItalic.ttf') format('truetype');font-weight:900;font-style:italic;font-display:swap}

:root{
  /* ——— Brand palette ——— */
  --op-color1:#c8893f;    /* copper — primary brand */
  --op-color2:#b5763a;    /* bronze — hover / secondary */
  --op-sand:#e8dfd0;      /* quiet sand — surfaces & dezent */
  --op-bg:#faf8f4;        /* background — warm off-white */
  --op-text:#1a1a1a;
  --op-grey:#7a7a7a;
  --op-white:#ffffff;
  --op-white-50:rgba(255,255,255,0.5);
  --op-whatsapp:#25d366;
  --op-tag-scrim:rgba(0,0,0,0.4);

  /* ——— Gradients ——— */
  --op-accent-gradient:linear-gradient(90deg,#c8893f,#e0a45a,#a06830,#c8893f);
  --op-bg-warm:linear-gradient(135deg,#f5f0e8 0%,#ede4d4 50%,#e8ddd0 100%);
  --op-bg-cool:linear-gradient(135deg,#eef4f8 0%,#ddeaf2 60%,#cfe0ed 100%);

  /* ——— Typography ——— */
  --op-font-sans:'Satoshi',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --op-font-display:'Montserrat','Satoshi',system-ui,sans-serif;
  --op-font-light:'Satoshi',system-ui,sans-serif;

  --op-body-size:clamp(1rem,1.6vw,1.5rem);
  --op-h1-size:clamp(2rem,5vw,4rem);
  --op-h2-size:clamp(1.5rem,3vw,2.5rem);
  --op-h3-size:1.5rem;
  --op-h4-size:1.25rem;
  --op-hero-title:clamp(2.5rem,7vw,5.5rem);
  --op-line-height:1.618;

  /* ——— Spacing ——— */
  --op-space-xs:0.5rem;
  --op-space-sm:1rem;
  --op-space-md:1.5rem;
  --op-space-lg:2rem;
  --op-space-xl:3rem;
  --op-space-2xl:5rem;
  --op-space-3xl:10rem;

  /* ——— Radii ——— */
  --op-radius-sm:0.35rem;
  --op-radius-md:0.5rem;
  --op-radius-lg:0.75rem;
  --op-radius-xl:1rem;
  --op-radius-pill:100rem;

  /* ——— Shadows ——— */
  --op-shadow-sm:0 1px 3px rgba(0,0,0,0.08);
  --op-shadow-md:0 4px 12px rgba(0,0,0,0.1);
  --op-shadow-lg:0 8px 24px rgba(0,0,0,0.12);
  --op-shadow-brand:0 4px 20px rgba(200,137,63,0.35);
  --op-shadow-brand-lg:0 8px 28px rgba(200,137,63,0.45);

  /* ——— Motion ——— */
  --op-transition-fast:0.2s ease;
  --op-transition-base:0.3s ease;
  --op-transition-slow:0.5s ease;
  --op-ease-out-back:cubic-bezier(0.25,0.46,0.45,0.94);

  /* ——— Layout ——— */
  --op-container:1200px;
  --op-navbar-h:56px;
}