/* --- S33.2 · Elementor responsive-visibility classes were never implemented ---
* .elementor-hide_desktop / _tablet / _mobile are emitted into the markup but no
* loaded stylesheet defines them (Elementor's frontend responsive CSS is not on
* the page). One element sitewide is affected — the homepage's mobile-only price
* bar (₹699–₹999 · UPI & CARDS + a cream SHOP THE DROP) — which therefore leaked
* onto desktop, duplicating the hero CTA in a second, off-token colour.
* Restoring the contract is the root-cause fix; recolouring the button would
* have left a mobile bar on desktop (Review 5 issue #4).
* Breakpoints match Elementor's defaults (tablet ≤1024, mobile ≤767). */
@media (min-width:1025px){ .elementor-hide_desktop{display:none!important} }
@media (min-width:768px) and (max-width:1024px){ .elementor-hide_tablet{display:none!important} }
@media (max-width:767px){ .elementor-hide_mobile{display:none!important} }
/* --- S33.3 · About hero: two ghost buttons = no primary action ---------------
* Both CTAs shipped as outlined ghosts, so nothing on the page read as "start
* here", and neither used the brand's CTA colour — the same pair is solid
* terracotta + text link on the homepage hero (Review 5 issue #4).
* Promote the FIRST button in the pair to the sitewide primary token; the rest
* stay ghost as secondaries.
*
* Order, not href: both buttons currently point at /shop/ — "THE FABRIC" is a
* mislabelled link (the homepage's equivalent goes to /#the-cotton), so href
* cannot tell them apart. Logged as a separate content bug; this rule is
* deliberately independent of it and will not need revisiting when it is fixed.
* Order is also id-free: generated element ids (1d0df00) change on re-export. */
body.page-id-101 .elementor-widget-button:not(.elementor-widget-button ~ .elementor-widget-button)
a.elementor-button{
background-color:var(--rasvo-terracotta,#C2542B)!important;
border-color:var(--rasvo-terracotta,#C2542B)!important;
color:var(--rasvo-paper,#FFFEFA)!important;
}
body.page-id-101 .elementor-widget-button:not(.elementor-widget-button ~ .elementor-widget-button)
a.elementor-button:hover,
body.page-id-101 .elementor-widget-button:not(.elementor-widget-button ~ .elementor-widget-button)
a.elementor-button:focus-visible{
background-color:color-mix(in srgb,var(--rasvo-terracotta,#C2542B) 84%,#000)!important;
border-color:color-mix(in srgb,var(--rasvo-terracotta,#C2542B) 84%,#000)!important;
}
/* --- S33.4 · Footer logo was centred inside a left-aligned column -------------
* The image widget carries text-align:center while the tagline and every link
* column under it start at the column's left edge — measured 94px apart, which
* reads as an unset alignment rather than a choice.
* !important: Elementor emits the alignment as
* `.elementor-468 .elementor-element.elementor-element-{id}{text-align:center}`
* (0,3,0), and hardcoding that generated id breaks on re-export. */
[data-elementor-type="footer"] .elementor-widget-image{text-align:left!important}
[data-elementor-type="footer"] .elementor-widget-image img{margin-left:0!important}
/* --- S33.5 · About: two-column row was centre-aligned ------------------------
* Both columns lead with a 608x456 image, but the row is align-items:center and
* the columns differ in height (653 vs 605, because the left paragraph runs 3
* lines and the right 2). Centring split the difference and dropped the right
* image exactly 24px below the left one. Top-align so the images and headings
* line up; the paragraphs ending at different depths is normal editorial
* layout, and the section already carries whitespace below both.
* Selector matches this one row (verified: 1 hit) without a generated id. */
body.page-id-101 .e-con-inner:has(> .e-con .elementor-widget-image){align-items:flex-start}
/* --- S33.6 · PDP variation label sat off its value's baseline -----------------
* `: M` — the label computes
* vertical-align:middle and the value baseline, so the value floated like a
* superscript next to its own label on every variation row. Agree on baseline. */
html body.single-product .variations th.label label,
html body.single-product .variations .label label,
html body.single-product .variations .woo-selected-variation-item-name{
vertical-align:baseline;
}
/* --- S33.7 · Trust-row / contact icons out-weighed the type they sit in -------
* Elementor icon widgets render solid #141A23 at full strength beside 12–13px
* muted text, so they read as heavier stock glyphs dropped into a refined
* layout. Same muted token as the labels they caption. Scoped to the commerce
* + contact surfaces so nav//UI icons elsewhere keep their weight. */
body.woocommerce-cart .elementor-icon svg,
body.woocommerce-checkout .elementor-icon svg,
body.page-id-37 .elementor-icon svg{
fill:var(--rasvo-v2-muted-on-light,#4A515C);
color:var(--rasvo-v2-muted-on-light,#4A515C);
}
/* NOT FIXED — PDP reassurance line ("SECURE CHECKOUT · 7-DAY EXCHANGE ·" /
* "DISPATCHED IN 2 DAYS") still breaks onto a trailing separator. text-wrap:
* balance would fix it, but the line carries no distinguishing class, so the
* only selectors that reach it also catch the product
and every section
* heading — too broad a change for an item CLAUDE.md lists as deferred /
* do-not-reopen. Needs a class on the widget. Left alone deliberately. */
/* --- S33.8 · Native form controls were browser-default blue ------------------
* The terms checkbox and the payment radios are the only unstyled controls in
* an otherwise fully custom form, and they land at the last step before pay.
* One property brands every native control without replacing any of them —
* no pseudo-element rebuild, no lost keyboard/AT behaviour. */
html body{accent-color:var(--rasvo-terracotta,#C2542B)}