/*
Theme Name: Orpheus
Theme URI: https://orpheusmindtechnologies.com/
Author: Orpheus Mind Technologies
Description: The Orpheus Mind Technologies theme, written from the brand book of 2 November 2026 (rule 432) and its part 11 (rules 461 to 464). One stylesheet, one script, no page builder. Phase 2 of orpheus-theme-replacement-plan-2026-11-05.md.
Version: 0.2.7
Text Domain: orpheus
*/

/* 1. The palette (brand book part 1). These values and no others. */
:root{
  --o-navy:#10317A;
  --o-text:#0A2354;
  --o-body:#33415C;
  --o-muted:#5A6B86;
  --o-page:#EEF3FA;
  --o-pale:#F4F8FC;
  --o-edge:#DBE6F3;
  --o-chip:#EAF4FC;
  --o-white:#FFFFFF;
  --o-soft:#4768B0;
  --o-cyan:rgba(93,230,254,.30);
  --o-self-a:#F07C5B;
  --o-self-b:#F5A84B;
  --o-prac-a:#0E8C9A;
  --o-prac-b:#2FBFC9;
  --o-cream:#FFF8E6;
  --o-paleteal:#EDF7F8;
  --o-self:linear-gradient(135deg,var(--o-self-a),var(--o-self-b));
  --o-prac:linear-gradient(135deg,var(--o-prac-a),var(--o-prac-b));
  --o-route:var(--o-navy);           /* the accent of a shared page is navy */
  --o-route-grad:var(--o-navy);
  --o-shadow:0 2px 8px rgba(16,49,122,.06);
  --o-lift:0 6px 14px rgba(16,49,122,.22);
  --o-press:0 2px 6px rgba(16,49,122,.18);
  --o-head:"Nunito",sans-serif;
  --o-font:"DM Sans",sans-serif;
  --o-wave:url(https://cdn.orpheusmindtechnologies.com/app/uploads/2020/11/Wavy-image-for-comment-5.png);
  --o-wave-flip:url(https://cdn.orpheusmindtechnologies.com/app/uploads/2026/07/Wavy-image-for-comment-5-flipped.png);
  --o-header-h:96px;
  --o-start:32px;                    /* rule 461: every page starts 32 px under the header */
  --o-gutter:24px;
  --o-max:1188px;                   /* 1140 px of content at 24 px gutters: Bootstrap's 1170 container less its 15 px padding, which every raw page was built for */
  --o-measure:760px;
}
[data-o-route="self-help"]{--o-route:var(--o-self-a);--o-route-grad:var(--o-self)}
[data-o-route="practitioner"]{--o-route:var(--o-prac-a);--o-route-grad:var(--o-prac)}

/* 2. Base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--o-page);color:var(--o-body);font-family:var(--o-font);font-size:17px;line-height:1.6}
h1,h2,h3,h4,h5,h6{font-family:var(--o-head);font-weight:800;color:var(--o-text);line-height:1.2;margin:0 0 .5em}
h1{font-size:2.4rem}h2{font-size:1.9rem}h3{font-size:1.4rem}h4{font-size:1.15rem;font-weight:700}
p{margin:0 0 1em}
a{color:var(--o-navy)}
img,video,svg{max-width:100%;height:auto}
::selection{background:var(--o-navy);color:#fff}
.o-skip{position:absolute;left:-9999px;top:0;background:#fff;color:var(--o-navy);padding:8px 14px;z-index:10000}
.o-skip:focus{left:16px;top:16px}
.o-container{max-width:var(--o-max);margin:0 auto;padding:0 var(--o-gutter)}
body.o-portal .o-page > .o-container{max-width:1218px}   /* 0.2.0 (family 5): the account shell keeps Redel's 1170 px column (menu 351, content 796, gap 23), the widths every portal screen was measured at; the header and footer stay at 1140 */
.o-measure{max-width:var(--o-measure)}
.o-muted{color:var(--o-muted);font-size:.92rem}

/* 3. Header (rules 311 and 312): solid navy in the flow; over a banner it is fixed, a faint navy tint with a blur, solid once scrolled. */
.o-header{background:var(--o-navy);color:#fff;position:relative;z-index:9000;transition:background .25s ease,box-shadow .25s ease}
.o-header .o-container{display:flex;align-items:center;gap:24px;min-height:var(--o-header-h)}
.o-logo{display:inline-flex;align-items:center;flex:0 0 auto}
.o-logo img{display:block;height:40px;width:auto}
.o-nav{margin-left:auto;display:flex;align-items:center;gap:8px}
.o-menu,.o-menu ul{list-style:none;margin:0;padding:0}
.o-menu{display:flex;gap:4px;align-items:center}
.o-menu>li{position:relative}
.o-menu a{display:block;color:#fff;text-decoration:none;font-family:var(--o-head);font-weight:700;font-size:.95rem;padding:10px 12px;border-radius:999px}
.o-menu>li>a:hover,.o-menu>li>a:focus-visible,.o-menu>li.is-open>a{background:rgba(255,255,255,.12)}
.o-menu .sub-menu{position:absolute;top:100%;left:0;min-width:240px;background:#fff;border:1px solid var(--o-edge);border-radius:14px;box-shadow:0 8px 24px rgba(16,49,122,.14);padding:8px;display:none;z-index:1}
.o-menu li:hover>.sub-menu,.o-menu li.is-open>.sub-menu,.o-menu li:focus-within>.sub-menu{display:block}
.o-menu .sub-menu a{color:var(--o-text);font-weight:600;padding:8px 12px;border-radius:10px}
.o-menu .sub-menu a:hover,.o-menu .sub-menu a:focus-visible{background:var(--o-chip)}
.o-menu .menu-item-has-children>a::after{content:"";display:inline-block;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-3px);margin-left:8px}
.o-header__tools{display:flex;align-items:center;gap:8px}
.o-nav-toggle{display:none;margin-left:auto;width:44px;height:44px;border:0;background:transparent;color:#fff;border-radius:10px;cursor:pointer}
.o-nav-toggle span{display:block;width:22px;height:2px;background:#fff;margin:5px auto;transition:transform .2s ease,opacity .2s ease}
body.o-has-banner .o-header{position:fixed;top:0;left:0;right:0;background:rgba(16,49,122,.30)}
body.o-has-banner .o-header .o-container{min-height:120px}   /* over a banner the header is 120 px tall, as every hero was built for (rule 311) */
body.o-has-banner .o-header.is-scrolled .o-container{min-height:var(--o-header-h)}
body.o-has-banner .o-page{padding-top:0}                        /* a page that draws its own hero starts at the very top, under the header */
body.o-has-banner .o-header::before{content:"";position:absolute;inset:0;z-index:-1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none}
body.o-has-banner .o-header.is-scrolled{background:var(--o-navy);box-shadow:0 2px 12px rgba(0,0,0,.18)}
body.o-has-banner .o-header.is-scrolled::before{display:none}
body.admin-bar.o-has-banner .o-header{top:32px}   /* only the fixed header over a banner moves under the admin bar; an in-flow header already sits below it (0.1.4: it had slid 32 px over the page for a signed-in administrator) */
@media (max-width:782px){body.admin-bar.o-has-banner .o-header{top:46px}}
@media (max-width:1024px){
  .o-nav-toggle{display:block}
  .o-nav{position:fixed;top:0;right:0;bottom:0;width:min(360px,88vw);background:var(--o-navy);flex-direction:column;align-items:stretch;padding:88px 20px 24px;transform:translateX(100%);transition:transform .25s ease;overflow:auto;z-index:9001}
  body.o-nav-open .o-nav{transform:none}
  .o-menu{flex-direction:column;align-items:stretch;gap:2px}
  .o-menu .sub-menu{position:static;display:none;background:rgba(255,255,255,.08);border:0;box-shadow:none;padding:4px 0 4px 12px}
  .o-menu li.is-open>.sub-menu{display:block}
  .o-menu .sub-menu a{color:#fff}
  .o-menu li:hover>.sub-menu{display:none}
  .o-menu li.is-open:hover>.sub-menu{display:block}
  body.o-nav-open .o-nav-toggle{position:fixed;top:14px;right:20px;z-index:9002}
  body.o-nav-open .o-nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.o-nav-open .o-nav-toggle span:nth-child(2){opacity:0}
  body.o-nav-open .o-nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* 4. The banner slot (rule 463; rule 467, 6 Nov 2026): a photo band as tall as every hero on the site (704 px), top anchored; the heading at the column's left edge with its top 261 px down the band, the home page's place, in the house heading (70 px / 500, -2 px); no panel; the wash by page meta (orpheus_banner_wash) where the photo is measured short. */
.o-banner{position:relative;min-height:704px;background-color:var(--o-navy);background-image:var(--o-banner-img,none);background-position:center top;background-size:cover;background-repeat:no-repeat;display:flex;align-items:flex-start;padding-top:261px;box-sizing:border-box}   /* 0.1.6: the colour and the picture as separate properties: the shorthand with an unset --o-banner-img was invalid and left the wave banner with no navy */
.o-banner--wave{background-color:var(--o-navy);background-image:var(--o-wave);background-size:160% auto;background-position:50% 100%}
.o-banner__panel{width:100%;max-width:var(--o-max);margin:0 auto;padding:0 var(--o-gutter);color:#fff;box-sizing:border-box}
.o-banner__panel h1{color:#fff;margin:0 0 31px;font-family:"DM Sans",sans-serif;font-size:70px;font-weight:500;line-height:1.07;letter-spacing:-2px;text-shadow:0 0 3px rgba(0,0,0,.08);max-width:760px}
.o-banner__panel p{color:#fff;margin:0;font-size:1.25rem;line-height:1.5;max-width:600px}
.o-banner--right .o-banner__panel{text-align:right}.o-banner--right .o-banner__panel h1,.o-banner--right .o-banner__panel p{margin-left:auto}   /* the words on the right where the photo's left is the busy side (rule 467, measured) */
.o-banner{margin-bottom:32px}   /* the brand book's gap between the banner and the first section */
@media (max-width:700px){.o-banner{min-height:420px;padding-top:150px}.o-banner__panel h1{font-size:34px;letter-spacing:-1px;margin-bottom:16px}}

/* 4a. The wash (rule 467): a faint dark layer over the whole hero image where the measured contrast of the text falls short; never a box behind the words. The page sets --o-wash (.35 or .40); the layer sits above the image and below the content. */
.o-wash{position:relative;isolation:isolate}
.o-wash::after{content:"";position:absolute;inset:0;background:rgba(26,32,44,var(--o-wash,.35));z-index:-1;pointer-events:none}
.o-banner.o-wash::after{z-index:0}.o-banner.o-wash>*{position:relative;z-index:1}

/* 4b. WooCommerce under the theme (family 4): its own templates inside the page column, and the cart, checkout and account pages (the body class, 0.1.9); buttons as the house pills, fields as the form look, the product grid as cards. Measured on rehearsal 6 Nov 2026. */
.o-woo{padding:0 0 48px}
.o-woo .woocommerce-products-header,.o-woo .woocommerce-breadcrumb,.o-woo .woocommerce-result-count,.o-woo .woocommerce-ordering,body.woocommerce-page .o-page .woocommerce-products-header,body.woocommerce-page .o-page .woocommerce-breadcrumb,body.woocommerce-page .o-page .woocommerce-result-count,body.woocommerce-page .o-page .woocommerce-ordering{font-family:var(--o-body-font,Nunito,sans-serif)}
.o-woo .woocommerce-breadcrumb,body.woocommerce-page .o-page .woocommerce-breadcrumb{font-size:14px;color:#5A6B86;margin:0 0 18px}
.o-woo ul.products,body.woocommerce-page .o-page ul.products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none}
.o-woo ul.products li.product,body.woocommerce-page .o-page ul.products li.product{width:auto;margin:0;float:none;background:#fff;border:1px solid #DBE6F3;border-top:4px solid var(--o-navy);border-radius:18px;padding:0 0 22px;box-shadow:0 2px 8px rgba(16,49,122,.06);text-align:center;display:flex;flex-direction:column}
.o-woo ul.products li.product img,body.woocommerce-page .o-page ul.products li.product img{width:100%;height:auto;border-radius:0;margin:0}
.o-woo ul.products li.product .woocommerce-loop-product__title,body.woocommerce-page .o-page ul.products li.product .woocommerce-loop-product__title{font:600 20px/1.3 "DM Sans",sans-serif;color:var(--o-navy);padding:18px 20px 6px;margin:0}
.o-woo ul.products li.product .price,body.woocommerce-page .o-page ul.products li.product .price{font:600 17px Nunito,sans-serif;color:#33415C;margin:0 0 14px}
.o-woo ul.products li.product .button,body.woocommerce-page .o-page ul.products li.product .button{margin-top:auto;align-self:center}
.o-woo .button,.o-woo button.button,.o-woo a.button,.o-woo input.button,.o-woo .single_add_to_cart_button,.o-woo .checkout-button,.o-woo #place_order,body.woocommerce-page .o-page .button,body.woocommerce-page .o-page button.button,body.woocommerce-page .o-page a.button,body.woocommerce-page .o-page input.button,body.woocommerce-page .o-page .single_add_to_cart_button,body.woocommerce-page .o-page .checkout-button,body.woocommerce-page .o-page #place_order{display:inline-block;background:var(--o-navy) !important;color:#fff !important;border:0 !important;border-radius:40px !important;font:600 16px/32px Nunito,sans-serif !important;padding:4px 32px !important;height:auto;cursor:pointer;text-decoration:none;transition:all .2s}
.o-woo .button:hover,.o-woo button.button:hover,.o-woo a.button:hover,.o-woo #place_order:hover,body.woocommerce-page .o-page .button:hover,body.woocommerce-page .o-page button.button:hover,body.woocommerce-page .o-page a.button:hover,body.woocommerce-page .o-page #place_order:hover{background:#0A2354 !important;transform:translateY(-2px)}
.o-woo table.shop_table,body.woocommerce-page .o-page table.shop_table{border:1px solid #DBE6F3;border-radius:18px;border-collapse:separate;overflow:hidden;font-family:Nunito,sans-serif}
.o-woo table.shop_table th,body.woocommerce-page .o-page table.shop_table th{background:#F4F8FC;color:var(--o-navy);font-weight:700}
.o-woo table.shop_table td,.o-woo table.shop_table th,body.woocommerce-page .o-page table.shop_table td,body.woocommerce-page .o-page table.shop_table th{border-color:#DBE6F3;padding:12px 14px}
.o-woo input.input-text,.o-woo .input-text,.o-woo textarea,body.woocommerce-page .o-page input.input-text,body.woocommerce-page .o-page .input-text,body.woocommerce-page .o-page textarea{box-sizing:border-box;border:1px solid #DBE6F3 !important;border-radius:10px !important;background:#fff !important;height:44px;padding:0 12px !important;font:400 16px Nunito,sans-serif !important;color:#33415C}
.o-woo textarea,body.woocommerce-page .o-page textarea{height:110px;padding:10px 12px !important}
.o-woo .woocommerce-message,.o-woo .woocommerce-info,.o-woo .woocommerce-error,body.woocommerce-page .o-page .woocommerce-message,body.woocommerce-page .o-page .woocommerce-info,body.woocommerce-page .o-page .woocommerce-error{border:1px solid #DBE6F3;border-top:4px solid var(--o-navy);border-radius:18px;background:#F4F8FC;padding:14px 18px;font-family:Nunito,sans-serif}
.o-woo .product .summary .product_title,body.woocommerce-page .o-page .product .summary .product_title{font:500 44px/1.15 "DM Sans",sans-serif;color:var(--o-navy)}
.o-woo .product .summary .price,body.woocommerce-page .o-page .product .summary .price{font:600 24px Nunito,sans-serif;color:#33415C}
.o-woo .woocommerce-tabs ul.tabs,body.woocommerce-page .o-page .woocommerce-tabs ul.tabs{border:0;padding:0}.o-woo .woocommerce-tabs ul.tabs li{background:#fff;border:1px solid #DBE6F3;border-radius:40px;margin:0 8px 8px 0}.o-woo .woocommerce-tabs ul.tabs li.active{background:var(--o-navy)}.o-woo .woocommerce-tabs ul.tabs li.active a{color:#fff}
.o-woo .woocommerce-tabs ul.tabs li::before,.o-woo .woocommerce-tabs ul.tabs li::after,body.woocommerce-page .o-page .woocommerce-tabs ul.tabs li::before,body.woocommerce-page .o-page .woocommerce-tabs ul.tabs li::after{display:none}
@media (max-width:900px){.o-woo ul.products{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:600px){.o-woo ul.products{grid-template-columns:minmax(0,1fr)}}

/* 5. The page and its sections (part 3 and 4; rule 461). */
.o-page{padding:var(--o-start) 0 48px}
.o-sections>.o-section+.o-section{margin-top:28px}
.o-section{position:relative;background:#fff;border:1px solid var(--o-edge);border-top:4px solid var(--o-navy);border-radius:18px;box-shadow:var(--o-shadow);padding:40px 40px;overflow:hidden}
.o-sections>.o-section:nth-of-type(even){background:var(--o-pale)}
.o-section--pale{background:var(--o-pale)}
.o-section--white{background:#fff}
.o-section--navy,.o-section--band{border-top-width:1px;border-color:transparent;color:#fff}
.o-section--navy{background:var(--o-navy)}
.o-section--band{background:var(--o-route-grad)}
.o-section--navy :is(h1,h2,h3,h4,p,li,span,small,label){color:#fff}
.o-section--band :is(h1,h2,h3,h4,p,li,span,small,label){color:#fff}
.o-section--plain{border-top-width:1px}      /* the looked-at exception of part 3, named in the hand-over */
.o-section>*{position:relative;z-index:1}
@media (max-width:700px){.o-section{padding:24px 18px;border-radius:14px}}

/* 6. Boxes: the fill is the opposite of the section; the one-side 4 px edge says what the box does (part 3). */
.o-box{position:relative;background:#fff;border:1px solid var(--o-edge);border-radius:14px;box-shadow:var(--o-shadow);padding:22px 24px;overflow:hidden}
.o-section--pale .o-box,.o-sections>.o-section:nth-of-type(even) .o-box{background:#fff}
.o-section--white .o-box,.o-sections>.o-section:nth-of-type(odd) .o-box{background:var(--o-pale)}
.o-box>*{position:relative;z-index:1}
.o-box--info{border-left:4px solid var(--o-navy);padding-left:21px}
.o-box--action{border-left:4px solid var(--o-route);padding-left:21px;background:#fff !important}
.o-box--step{border-top:4px solid var(--o-route);padding-top:19px;background:#fff !important}
.o-box--summary{border-top:4px solid var(--o-navy);padding-top:19px;background:var(--o-pale) !important}
.o-box--person{border-left:4px solid var(--o-navy);padding-left:21px;background:var(--o-pale) !important}
.o-box--safety{border-left:4px solid #C8352B;padding-left:21px;background:#FDEDEB !important}
.o-box--course{border-top:4px solid var(--o-route);padding-top:19px;background:#fff !important}
.o-box--picture{border-left:4px solid var(--o-navy);padding:0;background:#fff !important}
.o-box--picture img{display:block;width:100%;border-radius:0}
.o-box--picture .o-box__body{padding:18px 22px}
.o-box--door{border:0;color:#fff;background:var(--o-route-grad) !important;padding:28px}
.o-box--door :is(h2,h3,p){color:#fff}
.o-box--door[data-o-route="self-help"]{background:var(--o-self) !important}
.o-box--door[data-o-route="practitioner"]{background:var(--o-prac) !important}
.o-box--discount{border:0;background:var(--o-navy) !important;color:#fff;background-image:var(--o-wave-flip) !important;background-size:120% auto;background-position:50% 100%;background-repeat:no-repeat}
.o-section--navy .o-box,.o-section--band .o-box{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.25);color:#fff}
.o-section--navy .o-box :is(h3,h4,p,li,span),.o-section--band .o-box :is(h3,h4,p,li,span){color:#fff}
.o-section--navy .o-box--white,.o-section--band .o-box--white{background:#fff !important;color:var(--o-body)}
.o-section--navy .o-box--white :is(h3,h4,p,li,span){color:var(--o-text)}
.o-sub{background:var(--o-cream);border:1px solid var(--o-edge);border-radius:10px;padding:14px 16px}
.o-sub--teal{background:var(--o-paleteal)}
.o-sub--white{background:#fff}
.o-sub--navy{background:var(--o-navy);color:#fff}
.o-row{display:grid;gap:20px}
.o-row--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.o-row--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.o-row--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.o-row--tints>.o-box:nth-child(3n+1){background:var(--o-cream) !important}
.o-row--tints>.o-box:nth-child(3n+2){background:#fff !important}
.o-row--tints>.o-box:nth-child(3n+3){background:var(--o-paleteal) !important}
@media (max-width:980px){.o-row--3,.o-row--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.o-row--2,.o-row--3,.o-row--4{grid-template-columns:minmax(0,1fr)}}

/* 7. Pills: the native pill, solid navy, one hover everywhere (part 6; rules 374, 378, 385). */
.o-pill,.o-pill--light,.o-pill--route{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--o-head);font-weight:700;font-size:.95rem;line-height:1.2;padding:12px 28px;border-radius:999px;border:2px solid var(--o-navy);background:var(--o-navy);color:#fff;text-decoration:none;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background-color .18s ease,color .18s ease}
.o-pill--light{background:#fff;color:var(--o-navy);border-color:#fff}
.o-pill--route{background:transparent;color:var(--o-route);border-color:var(--o-route)}
.o-pill:is(:hover,:focus-visible){background:var(--o-text);border-color:var(--o-text);color:#fff}
.o-pill--light:is(:hover,:focus-visible){background:var(--o-chip);color:var(--o-navy)}
.o-pill--route:is(:hover,:focus-visible){background:var(--o-route);color:#fff}
@media (prefers-reduced-motion:no-preference){
  :is(.o-pill,.o-pill--light,.o-pill--route):is(:hover,:focus-visible){transform:translateY(-2px);box-shadow:var(--o-lift)}
  :is(.o-pill,.o-pill--light,.o-pill--route):active{transform:none;box-shadow:var(--o-press)}
}
.o-pill--save{background:#1E7D34;border-color:#1E7D34}
.o-pill--save:is(:hover,:focus-visible){background:#176329;border-color:#176329}
.o-pill--danger{background:#C8352B;border-color:#C8352B}
.o-pill--beige{background:#EFE6D8;border-color:#EFE6D8;color:var(--o-text)}
.o-pills{display:flex;flex-wrap:wrap;gap:12px}

/* 8. The nav pill box (rule 462): as wide as its pills, centred, one line on desktop, 22 px clear on all sides; on a phone it takes the page's box edge and its pills wrap and centre. */
.o-navpills{display:flex;flex-wrap:nowrap;justify-content:center;gap:10px;width:fit-content;max-width:100%;margin:0 auto 28px;padding:22px;background:#fff;border:1px solid var(--o-edge);border-radius:18px;box-shadow:var(--o-shadow)}
.o-navpills .o-pill,.o-navpills .o-pill--light{white-space:nowrap}
.o-navpills .o-pill[aria-current],.o-navpills .is-current{background:var(--o-text);border-color:var(--o-text)}
@media (max-width:1024px){.o-navpills{flex-wrap:wrap;width:auto;padding:22px}}

/* 9. Motifs (part 5 and rule 464): different sizes, placed anywhere, most escaping their box. The box or section sets --x, --y, --size and --alpha; the motif is decoration only and never over text. */
.o-motif{position:absolute;left:var(--x,-10%);top:var(--y,-10%);width:var(--size,260px);height:var(--size,260px);border-radius:50%;pointer-events:none;z-index:0;opacity:var(--alpha,.18);color:var(--o-soft)}
.o-motif--sphere{background:currentColor}
.o-motif--rings{background:repeating-radial-gradient(circle at center,currentColor 0 2px,transparent 2px 22px)}
.o-motif--dots{background:radial-gradient(circle,currentColor 1.6px,transparent 2px) 0 0/18px 18px;border-radius:0;opacity:var(--alpha,.32)}
.o-motif--ellipse{background:transparent;border:2px solid currentColor;border-radius:50%;transform:rotate(var(--rot,-18deg)) scaleY(.42)}
.o-motif--self{color:var(--o-self-b)}
.o-motif--prac{color:var(--o-prac-b)}
.o-motif--navy{color:var(--o-navy)}
.o-motif--white{color:#fff}
.o-motif--xs{--size:90px}.o-motif--s{--size:160px}.o-motif--m{--size:260px}.o-motif--l{--size:420px}.o-motif--xl{--size:640px}
.o-wave{position:absolute;left:0;right:0;height:46%;pointer-events:none;z-index:0;background:var(--o-wave) 50% 100%/160% auto no-repeat;opacity:.38}
.o-wave--rise{bottom:0}
.o-wave--hang{top:0;transform:scaleY(-1)}
.o-section--navy .o-wave{opacity:1;background-image:var(--o-wave-flip)}

/* 10. Forms (the form look of 31 Oct: a faint fill round white fields, loose rings) and tables. */
.o-form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),.o-form select,.o-form textarea,.o-field input,.o-field select,.o-field textarea{width:100%;font:inherit;color:var(--o-text);background:#fff;border:1px solid var(--o-edge);border-radius:10px;padding:10px 14px;min-height:46px}
.o-form textarea{min-height:120px}
.o-form :is(input,select,textarea):focus-visible{outline:3px solid rgba(16,49,122,.22);outline-offset:1px;border-color:var(--o-navy)}
.o-form label,.o-field label{display:block;font-family:var(--o-head);font-weight:700;color:var(--o-text);margin:0 0 6px}
.o-field{margin:0 0 16px}
.o-form .is-invalid,.o-form input[aria-invalid=true]{border-color:#C8352B;box-shadow:0 0 0 3px rgba(200,53,43,.14)}
.o-error{color:#C8352B;font-weight:600}
.o-table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--o-edge);border-radius:14px;overflow:hidden}
.o-table th,.o-table td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--o-edge);vertical-align:top}
.o-table th{font-family:var(--o-head);font-weight:800;color:var(--o-text);background:var(--o-pale)}
.o-table tr:last-child td{border-bottom:0}
details.o-fold{border:1px solid var(--o-edge);border-radius:14px;background:#fff;padding:0 18px;margin:0 0 10px}
details.o-fold summary{cursor:pointer;list-style:none;padding:14px 0;font-family:var(--o-head);font-weight:700;color:var(--o-text);display:flex;align-items:center;gap:12px}
details.o-fold summary::-webkit-details-marker{display:none}
details.o-fold summary::before{content:"+";flex:0 0 26px;height:26px;border-radius:50%;background:var(--o-route);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800}
details.o-fold[open] summary::before{content:"\2212"}
details.o-fold>*:not(summary){padding:0 0 16px}
.o-chip{display:inline-block;padding:4px 12px;border-radius:999px;background:var(--o-chip);color:var(--o-navy);font-family:var(--o-head);font-weight:700;font-size:.85rem}

/* 11. Prose: the text pages. */
.o-prose{max-width:var(--o-measure)}
.o-post .o-prose{max-width:none}   /* a blog post runs across its card, as the look approved on 9 Sept 2026 and the live post have it (0.1.4) */
.o-prose h2{margin-top:1.4em}
.o-prose ul,.o-prose ol{padding-left:1.3em}
.o-prose li{margin:.3em 0}
.o-prose blockquote{margin:1.2em 0;padding:12px 20px;border-left:4px solid var(--o-navy);background:var(--o-pale);border-radius:0 14px 14px 0}

/* 12. The blog post and the lists. */
.o-post__hero img{width:100%;border-radius:18px;display:block}
.o-post__meta{color:var(--o-muted);font-size:.92rem;margin:0 0 1.2em}
.o-cards{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.o-card h3 a{text-decoration:none;color:var(--o-text)}

/* 13. Footer. */
.o-footer{background:var(--o-navy);color:#fff;margin-top:48px;padding:48px 0 32px}
.o-footer a{color:#fff;text-decoration:none}
.o-footer a:hover{text-decoration:underline}
.o-footer__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.o-footer__title{font-family:var(--o-head);font-weight:800;font-size:1.05rem;margin:0 0 10px}
.o-footer ul{list-style:none;margin:0;padding:0}
.o-footer li{margin:0 0 8px}
.o-footer__bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-top:36px;padding-top:24px;border-top:1px solid rgba(255,255,255,.18)}
.o-footer__logo img{height:24px;width:auto;display:block}
.o-social{display:flex;gap:12px;list-style:none;margin:0;padding:0}
.o-social a{display:inline-flex;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--o-navy);align-items:center;justify-content:center;transition:transform .16s ease,box-shadow .16s ease}
.o-social a:hover{transform:translateY(-2px);box-shadow:var(--o-lift);text-decoration:none}
.o-social svg{width:20px;height:20px;fill:currentColor}
.o-footer__copy{color:rgba(255,255,255,.85);font-size:.92rem}
@media (max-width:640px){.o-footer__cols{grid-template-columns:minmax(0,1fr)}}

/* 14. WooCommerce and plugin screens: the theme's wrappers only; the markup inside is the plugin's, styled in phase 3. */
.o-woo{padding:var(--o-start) 0 48px}
.woocommerce-notices-wrapper .woocommerce-message,.woocommerce-message,.woocommerce-info{border-top-color:var(--o-navy);background:#fff;border-radius:14px}
.woocommerce-error{border-top-color:#C8352B;background:#FDEDEB;border-radius:14px}

/* 15. Carried from Redel (0.2.6, 7 Nov 2026). (a) Bootstrap's reboot made every form control inherit the page font; without it the Clients tab row and the Resources bars fell to Arial.
   (b) Redel's button classes, as its main.css and styles.css drew them: the page content of the Resources tab and the WPBakery pages carries them (the pill links with the play arrow). */
button,input,select,textarea{font-family:inherit}
.redl-btn{display:inline-block;font-size:16px;font-weight:600;line-height:2;text-transform:none;text-align:center;position:relative;overflow:visible;border:none;outline:none;white-space:nowrap;vertical-align:middle;letter-spacing:.3px;cursor:pointer;box-shadow:none;border-radius:40px;min-width:163px;padding:4px 40px;text-decoration:none;transition:all .25s ease-in-out}
.redl-btn:hover,.redl-btn:focus{text-decoration:none}
.redl-btn.redl-btn-one{color:#000;background:#fff}
.redl-btn.redl-btn-one:hover{background:hsla(0,0%,100%,.8)}
.redl-btn.redl-btn-two{color:#fff;background-image:linear-gradient(260deg,#4768b0,#5de6fe 51%,#4768b0);background-color:transparent;background-size:200% auto;overflow:visible!important}
.redl-btn.redl-btn-two:hover,.redl-btn.redl-btn-two:focus{color:#fff;background-position:100%;background-color:transparent}
.redl-btn.redl-btn-three{color:#fff;background:#000}
.redl-btn.redl-btn-three:hover{background:rgba(0,0,0,.7)!important}
.redl-btn i{margin-right:6px;vertical-align:middle}
.btn-icon-right.redl-btn i{margin-right:0;margin-left:6px}
.btn-icon-left.redl-btn i{margin-right:6px;margin-left:0}
.redl-btn-small{min-width:80px;padding:8px 30px}
.redl-btn-medium{min-width:163px;padding:2px 40px 2px}
.redl-btn-large{min-width:199px;padding:15px 28px 13px}
.redl-btn-large i{font-size:17px}
.redl-btn i.fa-play::before{content:"\25B6";font-style:normal;font-size:.65em;line-height:1;vertical-align:1px} /* 0.2.7: Redel's FontAwesome play glyph, without the icon font */