/*
Theme Name: IPMA
Theme URI: https://www.ipmarketingalliance.com
Author: Firm Forward
Author URI: https://firmforward.com
Description: Block theme for the IP Marketing Alliance. Implements IPMA brand v1.0: Archivo type, Ink / Tangerine / Paper palette. Fully editable in the WordPress Site Editor; no page-builder plugin required. Self-hosted fonts (no third-party requests).
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 8.1
Version: 1.0.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ipma
Tags: block-theme, full-site-editing, accessibility-ready, one-column, custom-colors, custom-logo, custom-menu, editor-style, featured-images, threaded-comments, translation-ready
*/

/* ------------------------------------------------------------------
   Most styling lives in theme.json so it is editable in the UI.
   This file holds only what theme.json cannot express.
   ------------------------------------------------------------------ */

:root{
  --ipma-hair: rgba(26,21,18,.12);
  --ipma-hair-rev: rgba(250,250,248,.16);
}

html{ scroll-behavior:smooth; }
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

/* ---- Label / eyebrow style (Medium 500, tracked wide) ---- */
.is-style-ipma-label{
  font-weight:500 !important;
  font-size:var(--wp--preset--font-size--label) !important;
  letter-spacing:.25em !important;
  text-transform:uppercase !important;
  line-height:1.4 !important;
  color:var(--wp--preset--color--warm-gray);
}
.has-ipma-reverse .is-style-ipma-label,
.ipma-hero .is-style-ipma-label{ color:rgba(250,250,248,.62); }

/* ---- Tangerine period: the brand mark in running headlines ---- */
.ipma-dot{ color:var(--wp--preset--color--tangerine); }

/* ---- Short tangerine rule (replaces default full-width separator) ---- */
.is-style-ipma-rule{
  border:0 !important;
  height:3px !important;
  width:48px !important;
  max-width:48px !important;
  margin-left:0 !important;
  background:var(--wp--preset--color--tangerine) !important;
  opacity:1 !important;
}

/* ---- Hero: ink field with soft tangerine bloom ---- */
.ipma-hero{ position:relative; overflow:hidden; }
.ipma-hero::after{
  content:""; position:absolute; right:-160px; top:-160px;
  width:520px; height:520px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,107,26,.22), transparent 68%);
  pointer-events:none; z-index:0;
}
.ipma-hero > *{ position:relative; z-index:1; }

/* ---- Outline button on dark ---- */
.wp-block-button.is-style-ipma-outline-light > .wp-block-button__link{
  background:transparent !important;
  color:var(--wp--preset--color--paper) !important;
  border-color:rgba(250,250,248,.4) !important;
}
.wp-block-button.is-style-ipma-outline-light > .wp-block-button__link:hover{
  background:var(--wp--preset--color--paper) !important;
  color:var(--wp--preset--color--ink) !important;
  border-color:var(--wp--preset--color--paper) !important;
}
/* ---- Tangerine button: ink text, never white (WCAG AA) ---- */
.wp-block-button.is-style-ipma-tangerine > .wp-block-button__link{
  background:var(--wp--preset--color--tangerine) !important;
  color:var(--wp--preset--color--ink) !important;
  border-color:var(--wp--preset--color--tangerine) !important;
}
.wp-block-button.is-style-ipma-tangerine > .wp-block-button__link:hover{
  background:var(--wp--preset--color--paper) !important;
  border-color:var(--wp--preset--color--paper) !important;
  color:var(--wp--preset--color--ink) !important;
}
.wp-block-button__link{ transition:background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; }
.wp-block-button__link:hover{ transform:translateY(-1px); }

/* ---- Numbered pillar card ---- */
.ipma-pillar-num{
  display:block; font-weight:800; font-size:.8rem; letter-spacing:.02em;
  /* deepened tangerine: 4.58:1 on paper. Full #FF6B1A is 2.73:1 and fails AA at this size */
  color:var(--wp--preset--color--tangerine-deep); margin-bottom:.85rem;
}

/* ---- Team member tile ---- */
.ipma-member figure,
.ipma-member .wp-block-image{ margin:0 0 1rem; }
.ipma-member img{
  aspect-ratio:4/5; width:100%; height:auto; object-fit:cover;
  object-position:center top; border-radius:12px; display:block;
}
.ipma-monogram{
  aspect-ratio:4/5; border-radius:12px; background:var(--wp--preset--color--ink);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:2.4rem; letter-spacing:-.03em;
  color:var(--wp--preset--color--paper); margin-bottom:1rem;
}
.ipma-monogram .ipma-dot{ color:var(--wp--preset--color--tangerine); }
.ipma-join-tile{
  aspect-ratio:4/5; border:1.5px dashed var(--ipma-hair); border-radius:12px;
  display:flex; align-items:center; justify-content:center; text-align:center; padding:1.5rem;
}

/* ---- Event date block ---- */
.ipma-datechip{
  background:var(--wp--preset--color--ink); color:var(--wp--preset--color--paper);
  border-radius:14px; padding:2rem 2.4rem; text-align:center; display:inline-block;
}
.ipma-datechip .d{ font-size:3.4rem; font-weight:800; letter-spacing:-.03em; line-height:1; }
.ipma-datechip .m{
  font-weight:500; letter-spacing:.25em; font-size:.72rem; text-transform:uppercase;
  margin-top:.5rem; color:var(--wp--preset--color--tangerine);
}

/* ---- Header ---- */
.wp-block-template-part > .ipma-header{
  position:sticky; top:0; z-index:100;
  background:rgba(250,250,248,.92);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ipma-hair);
}
.admin-bar .wp-block-template-part > .ipma-header{ top:32px; }
.ipma-header .wp-block-site-logo img{ height:38px; width:auto; }
.ipma-header .wp-block-navigation-item__content{
  padding-bottom:6px; border-bottom:2px solid transparent;
}
.ipma-header .wp-block-navigation-item__content:hover,
.ipma-header .current-menu-item .wp-block-navigation-item__content{
  border-bottom-color:var(--wp--preset--color--tangerine);
}

/* ---- Footer ---- */
.ipma-footer a{ color:var(--wp--preset--color--paper) !important; text-decoration:none !important; }
.ipma-footer a:hover{ color:var(--wp--preset--color--tangerine) !important; }
.ipma-footer .wp-block-heading{ color:var(--wp--preset--color--paper); }
.ipma-footer-tag{ font-size:clamp(2.2rem,5vw,3.4rem); font-weight:800; letter-spacing:-.03em; line-height:1; }
.ipma-footer .is-style-ipma-label{ color:rgba(250,250,248,.55); }

/* ---- Forms (works with any form plugin or native comment form) ---- */
input[type=text],input[type=email],input[type=url],input[type=tel],textarea,select{
  font-family:inherit; font-size:1rem; color:var(--wp--preset--color--ink);
  background:#fff; border:1.5px solid var(--ipma-hair); border-radius:6px;
  padding:.85em 1em; width:100%; max-width:100%;
  transition:border-color .18s ease;
}
input:focus,textarea:focus,select:focus{
  border-color:var(--wp--preset--color--tangerine);
  outline:2px solid var(--wp--preset--color--tangerine-tint); outline-offset:1px;
}
label{ font-weight:500; font-size:.875rem; letter-spacing:.02em; }

/* ---- Accessibility: visible keyboard focus everywhere ---- */
a:focus-visible,button:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--wp--preset--color--tangerine) !important;
  outline-offset:2px !important;
}
.skip-link:focus{
  position:fixed !important; top:1rem; left:1rem; z-index:9999;
  background:var(--wp--preset--color--ink); color:#fff;
  padding:.75rem 1.25rem; border-radius:6px; width:auto; height:auto;
  clip:auto; clip-path:none;
}
::selection{ background:var(--wp--preset--color--tangerine-tint); color:var(--wp--preset--color--ink); }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ---- Reversed sections ---- */
.has-ink-background-color,
.has-ink-background-color p,
.has-ink-background-color li{ color:var(--wp--preset--color--paper); }

/* ---- Navigation: desktop bar sits on paper; overlay only on mobile ---- */
.ipma-header .wp-block-navigation a,
.ipma-header .wp-block-navigation .wp-block-navigation-item__content{
  color:var(--wp--preset--color--ink) !important;
}
.wp-block-navigation__responsive-container.is-menu-open{
  background-color:var(--wp--preset--color--ink) !important;
  padding-top:clamp(3rem,8vw,5rem);
}
.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
  color:var(--wp--preset--color--paper) !important;
  font-size:1.35rem; font-weight:600; letter-spacing:-.01em;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
  border-bottom-color:transparent !important;
}
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg{ fill:currentColor; }
.wp-block-navigation__responsive-container-close{ color:var(--wp--preset--color--paper); }
.ipma-header .wp-block-navigation__responsive-container-open{ color:var(--wp--preset--color--ink); }

/* ---- Reversed sections: make sure every text element flips ---- */
.has-ink-background-color h1,.has-ink-background-color h2,
.has-ink-background-color h3,.has-ink-background-color h4,
.ipma-hero h1,.ipma-hero h2,.ipma-hero h3,
.ipma-footer h1,.ipma-footer h2,.ipma-footer h3{
  color:var(--wp--preset--color--paper);
}

/* ---- Site logo fallback: theme lockup until a custom logo is uploaded ---- */
.ipma-header .ipma-logo-fallback img{ height:38px; width:auto; display:block; }

/* ---- Wordmark rendered in type: Archivo ExtraBold + tangerine square period.
        Faithful to the brand manual, resolution-independent, editable text. ---- */
.ipma-wordmark{
  font-weight:800; font-size:1.6rem; letter-spacing:-.04em; line-height:1;
  display:flex; align-items:flex-end; gap:.14em; margin:0 0 1.1rem;
}
.ipma-wordmark .ipma-sq{
  display:inline-block; width:.19em; height:.19em;
  background:var(--wp--preset--color--tangerine); margin-bottom:.06em;
}

/* ---- One left edge for the whole site: constrained text starts where wide
        sections start, instead of drifting to the centre. ---- */
.wp-block-group.alignwide > .wp-block-group:not(.alignwide),
.ipma-measure{ max-width:68ch; margin-left:0; margin-right:auto; }

/* On ink, full tangerine clears AA (6.35:1), so use the brand value there. */
.has-ink-background-color .ipma-pillar-num,
.ipma-hero .ipma-pillar-num{ color:var(--wp--preset--color--tangerine); }